Search code examples
jqueryhtmlhyperlinkbookmarks

jQuery Scroll Bottom


I searched this site but all I found is jQuery scrolling to top. How can I scroll to certain link or bookmark in bottom?

e.g. if I click a button: <a href="page.php?#contact_us">Contact Us</a> then it should scroll the page down to bookmark: <a name="contact_us"></a> with jQuery. How can I go about this?


Solution

  • You can try this code too:

    function scrollToAnchor(aid){
       var aTag = $("a[name='"+ aid +"']");
       $('html,body').animate({scrollTop: aTag.offset().top},'slow');
    }
    
    $(".link").on('click', function() {
       scrollToAnchor(this.id);
    });
    

    Fiddle in action

    Here .link is the class name of your anchor tag and id1, id2, id3..and so on is the id for each anchor, and you have to bind an click event on anchor link and pass the id in the function named scrollToAnchor(aid){...} where aid is the param for id which is passed from the bound event.