How can I scroll to a specific location on the page using jquery?

by

jQuery Scroll Plugin

since this is a question tagged with jquery i have to say, that this library has a very nice plugin for smooth scrolling, you can find it here:
http://plugins.jquery.com/scrollTo/

Excerpts from Documentation:

$('div.pane').scrollTo(...);//all divs w/class pane

or 

$.scrollTo(...);//the plugin will take care of this

Custom jQuery function for scrolling

you can use a very lightweight approach by defining your custom scroll jquery function

$.fn.scrollView = function () {
    return this.each(function () {
        $('html, body').animate({
            scrollTop: $(this).offset().top
        }, 1000);
    });
}

and use it like:

$('#your-div').scrollView();

Scroll to a page coordinates

Animate html and body elements with scrollTop or scrollLeft attributes

$('html, body').animate({
    scrollTop: 0,
    scrollLeft: 300
}, 1000);

Plain javascript

scrolling with window.scroll

window.scroll(horizontalOffset, verticalOffset);

only to sum up, use the window.location.hash to jump to element with ID

window.location.hash="#your-page-element";

Directly in HTML (accesibility enhancements)

<a href="#your-page-element">Jump to ID</a>

<div id="your-page-element">
    will jump here
</div>

More Related Contents:

  1. jQuery Scroll to bottom of page/iframe
  2. Scroll Automatically to the Bottom of the Page
  3. How to programmatically disable page scrolling with jQuery
  4. Scroll to a div using jQuery
  5. Trigger event when user scroll to specific element – with jQuery
  6. How to detect scroll direction
  7. Can I change the scroll speed using css or jQuery?
  8. jQuery scroll to ID from different page
  9. Activate CSS3 animation when the content scrolls into view
  10. How to scroll the window using JQuery $.scrollTo() function
  11. Detect middle button click (scroll button) with jQuery
  12. More efficient way to handle $(window).scroll functions in jquery?
  13. jquery change background color user scroll
  14. Animate scroll to ID on page load
  15. Show Div when scroll position
  16. How do I scroll a row of a table into view (element.scrollintoView) using jQuery?
  17. jQuery disable scroll when mouse over an absolute div
  18. Differentiate between scroll up/down in jquery? [duplicate]
  19. How do I get the height of a div’s full content with jQuery?
  20. jquery – keep window from changing scroll position while prepending items to a list?
  21. Disable scrolling when changing focus form elements ipad web app
  22. jQuery trigger when 2/3s of div are in viewport
  23. How to make div follow scrolling smoothly with jQuery?
  24. How to detect horizontal scrolling in jQuery?
  25. jQuery animate scroll
  26. scroll up and down a div on button click using jquery
  27. Use jQuery to check mousewheel event without scrollbar
  28. jQuery: detecting reaching bottom of scroll doesn’t work, only detects the top
  29. Detect user scroll down or scroll up in jQuery [duplicate]
  30. Jquery .on(‘scroll’) not firing the event while scrolling

Leave a Comment