CODEWITHSUNDEEP
jqueryanimationscrollscrolltop
user970727
user970727

Reputation: 1957

jQuery - ScrollTop without animation

How can I use the scrolltop without an animation

This code works:

var offTop = $('#box').offset().top;
offTop  = offTop-43;
$('#mainCt').animate({scrollTop: '+=' + offTop + 'px'}, 400);

And here are my (not working solutions):

$("#mainCt").scrollTop('+=' + offTop + 'px');                 // doesn't work
$("#mainCt").scrollTop('+='+offTop);                          // doesn't work
hhh = setTimeout(' $("#mainCt").scrollTop('+offTop+');',800); // doesn't work

DEMO
http://jsfiddle.net/DNNFF/9/

Upvotes: 29

Views: 56806

Answers (9)

Lance Nacabuan
Lance Nacabuan

Reputation: 1

[EDITED] This code will reset the view to its original starting position with its height equal to the device height temporarily excluding and disabling scroll and overflow. In short, it has the same function as scrolling to top without animation.

$('#yourButton').on('click', function(){
    $('html, body').css({ overflow: 'hidden', height: '100%' });
});

Upvotes: 0

O Thạnh Ldt
O Thạnh Ldt

Reputation: 1251

Demo with keep position on refresh page using jQuery:

//------KEEP SCROLL POSITION
        $(window).scroll(function () {
            sessionStorage.scrollTop = $(this).scrollTop();
        });
        $(document).ready(function () {
            if (sessionStorage.scrollTop != "undefined") {
                setTimeout(() => window.scrollTo({
                    top: sessionStorage.scrollTop,
                    left: 0,
                    behavior: 'auto'
                }), 5);
            }
        });

Upvotes: 0

user9717345
user9717345

Reputation: 

var offTop = $('#box').offset().top;
$(window).scrollTop(parseInt(offTop))

Upvotes: -1

Mrigesh Raj Shrestha
Mrigesh Raj Shrestha

Reputation: 620

Why not use it with less duration. I fiddled it and it had no animation. SInce there will be no time to see the animation, there will be no animation at all.

var offTop = $('#box').offset().top;
offTop  = offTop-43;
$('#mainCt').animate({scrollTop: '+=' + offTop + 'px'}, 50); //50 added here as duartion

Upvotes: 4

Jeroen Flamman
Jeroen Flamman

Reputation: 965

Skip jQuery. Just use JavaScript:

window.scroll(0, 0);

Upvotes: 19

chepe263
chepe263

Reputation: 2812

maybe if you don't want an animation or anything fancy just use an anchor

<a name="top"></a>

Place it where you need to scroll

and in your function where you are calling use

document.location.href="#top";

You could also create a function to append the anchor before the element, do the document.location thing and later remove that anchor.

http://jsfiddle.net/fSrxr/1/

Upvotes: 17

Mr_DeLeTeD
Mr_DeLeTeD

Reputation: 846

Can't you play with the duration ?

var offTop = $('#box').offset().top;
offTop  = offTop-43;
$('#mainCt').delay('800').animate({scrollTop: '+=' + offTop + 'px'}, 1);

Upvotes: 1

sod
sod

Reputation: 3928

http://api.jquery.com/scrollTop/

$(window).scrollTop(offTop)

Upvotes: 12

Rory McCrossan
Rory McCrossan

Reputation: 337713

Try this:

var offTop = $('#box').offset().top - 43;
$('#mainCt').scrollTop(offTop);

The scrollTop property accepts just an integer, no suffixes or units required.

Upvotes: 24

Related Questions