jQuery - scrolla till ett element kanske?

2016-12-20, 11:02 #1

Medlem

Reg: Apr 2013

Inlägg: 795

Såhär (typ) ser mitt fina (fungerande) skript ut.

(fungerar)

HTML-kod:

$(document).ready(function(){
  $(".comment21").hide();
  $(#btnComment21).click(function(){
    $(".comment21").toggle();
  });
});

När dokumentet är redo (färdigladdat) - göm klassen comment21.
När händelsen klick sker på id btnComment21 - så togglas (visas/göms) klassen comment21.

Detta funkar, men när man klickar på knappen så "uppdateras" sidan, man blir "uppscrollad" till sidans topp. Antingen vill jag att det inte sker någon scroll eller så vill jag att knappen hamnar i fokus (att man blir scrollad till knappen). Efter att ha googlat lite hittade jag scrollTo(), men det fungerar inte, några tips?

(fungerar inte)

HTML-kod:

$(document).ready(function(){
  $(".comment21").hide();
  $(#btnComment21).click(function(){
    $(".comment21").toggle();
    $('body').scrollTo(#btnComment21);
  });
});

Citera

2016-12-20, 11:16 #2

Medlem

Reg: Jul 2013

Inlägg: 15

Är btn en <a>-tagg? Inget fel med det men det blir den effekten "by-default"

Fixa det med att köra en preventDefault på a-taggens event.

Kod:

$(document).ready(function(){
  $(".comment21").hide();
  $(#btnComment21).click(function(event){
    $(".comment21").toggle();
    event.preventDefault();
  });
});

http://api.jquery.com/event.preventDefault/

Citera

2016-12-27, 22:40 #3

Medlem

Reg: Sep 2011

Inlägg: 469

Citat:

Ursprungligen postat av personkemi2.0

Såhär (typ) ser mitt fina (fungerande) skript ut.

(fungerar)

HTML-kod:

$(document).ready(function(){
  $(".comment21").hide();
  $(#btnComment21).click(function(){
    $(".comment21").toggle();
  });
});

När dokumentet är redo (färdigladdat) - göm klassen comment21.
När händelsen klick sker på id btnComment21 - så togglas (visas/göms) klassen comment21.

Detta funkar, men när man klickar på knappen så "uppdateras" sidan, man blir "uppscrollad" till sidans topp. Antingen vill jag att det inte sker någon scroll eller så vill jag att knappen hamnar i fokus (att man blir scrollad till knappen). Efter att ha googlat lite hittade jag scrollTo(), men det fungerar inte, några tips?

(fungerar inte)

HTML-kod:

$(document).ready(function(){
  $(".comment21").hide();
  $(#btnComment21).click(function(){
    $(".comment21").toggle();
    $('body').scrollTo(#btnComment21);
  });
});

Du har glömt "fnuttar" runt #btnComment21. Det bör vara $('body').scrollTo('#btnComment21');

Citera

jQuery - scrolla till ett element kanske?

Skapa ett konto eller logga in för att kommentera

Skapa ett konto

Logga in