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.
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. :)
you just need to provide an id at the end of the url .
like yoursite.com/page/#yourid
.
somewhere in your site <div id="yourid"></div>
.
And you are done, this doesn't animates the scrolling, if you want animated scrolling use , jquery animate
function.