Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery show DIV and scroll to it without hashtag in url

Tags:

jquery

hash

I have the following simple jQuery:

            $('#features').hide();

            $('#more').click(function(e)
            {
                e.preventDefault();
                $('#more').hide();
                $('#features').show();
            });

This shows a DIV when a user clicks the more link and using the preventDefault method the #features hash isn't added to the url. However I still want to scroll down to that DIV in the same way as when a hash is passed to the url just not show it in the address bar. How do I do this? Thanks

Note: I'm not looking for any fancy effects etc so don't want to use plugins like scrollTo etc

like image 940
Cameron Avatar asked Jun 04 '11 14:06

Cameron


2 Answers

You'll need to use $(window).scrollTop():

$('#more').click(function (e) {
    e.preventDefault();
    $('#more').hide();
    $('#features').show();
    $(window).scrollTop($('#features').offset().top);
});
like image 121
lonesomeday Avatar answered Sep 18 '22 16:09

lonesomeday


Just use scrollTop

$('html, body').scrollTop($("div#features").offset().top);

http://jsfiddle.net/niklasvh/4XEVc/

like image 1
Niklas Avatar answered Sep 18 '22 16:09

Niklas