如何使用Header滚动到特定ID？

Question

Like the link : http://getbootstrap.com/css/#type
Here when you open this link, Window will automatically scroll to the type id.
How did they do it?
I mean, how to scroll to a specific id on the same page using Header like some.com/post/#id Please comment below if you need more clarification.

EDIT 2 : Okay home.php#26 this is working..
But this is working only wen the page is already loaded and then i change the header.. i want it to work when page is loaded First time with this url only.

Like when u open http://getbootstrap.com/css/#type It automatically takes you to id "type". But when i load mywebsite/home.php?#26 it does nothing.

Answer 1

If you want to use headers, first include in the target GET variable to id where you want to scroll to.

Eg - /home.php?target=12 (12 is the id here)

Then use the following script:

$(window).load(function(){
    $('html,body').animate({ scrollTop: $('#<?php echo $_GET['target'];  ?>').offset().top - 100 }, 'slow');
});

Here you go with Your scroll plus cool jQuery effect. :)