user1852196
user1852196

Reputation: 127

JQuery smooth scroll to id from URL

Let's say you have the following URL, (www.domain.com/page.php#_number).

I want to extract the id from the url**(_1)** and scroll to it on page load.

Your help will be appreciated.

Thanks for your help all.

The answer:-

$(document).ready(function() { 
    var $root = $('html, body');
    var ancloc = window.location.hash;
    event.preventDefault();
        $root.animate({
            scrollTop: $(ancloc).offset().top
        }, 500, function () {
            window.location.hash = href;
        });
        return false;
});

Upvotes: 3

Views: 21859

Answers (2)

Okan Kocyigit
Okan Kocyigit

Reputation: 13441

1- You can get the string "#number" by location.hash.

2-You can use a jQuery plug-in like jQuery Scrollbar Slider

You don't need to create click event, it handles that.

EDIT:

If you want it to work without click, on page load, you must prevent default browser behavior. Because browser will scroll automatically.

here is another DEMO that works on page load DEMO

Upvotes: 1

Casey Dwayne
Casey Dwayne

Reputation: 2169

Why not just use an anchor <a href="http://www.domain.com/page.php#number"> and animate that. Check this link: Smooth scrolling when clicking an anchor link

Upvotes: 2

Related Questions