Animating scrollTop

[gingerbeardman]

The following works in jQuery but not zepto. Am I missing something?

$(function() {
    $('#top').click(
        function (e) {
            $('html, body').animate({scrollTop: '0px'}, 'fast');
            return false;
        }
    );
});

[max-degterev]

Here you go. Doesn't work in Firefox though. Care to improve? https://github.com/suprMax/ZeptoScroll

[gingerbeardman]

Thanks, I'll take a look. I ended up using a generic JS solution but will perhaps retrofit your plugin.

[alfrednerstu]

Sorry for the duplicate.

I would just like to add that the ScrollLeft value is good in addition to ScrollTop. Especially useful for animating for example carousels and photo galleries.

[mislav]

Zepto only supports CSS transitions for animations. Stuff that isn't CSS therefore can't be animated.

I'm going to think about animating scrollTop, but for now, don't count on it. Use generic JS plugins.

[madrobby]

This is definitely plugin material.

[KrisHedges]

So... I am having an issue with scrollTop() by itself in latest Firefox 19.0.2 I've built zepto from src to get the latest version of scrollTop(), but in FF scrollTop() is always just 0. Works fine in chrome & safari. I haven't tested in IE yet. Example: coffeescript position = -> $('body').scrollTop()

window.onscroll = -> console.log position()

So long as you can get an accurate scrollTop() animating the scroll is fairly trivial and I agree and would prefer adding no non CSS animations if at all possible to Zepto but getting accurate scrollTop() scrollLeft() seems more than reasonable.

Any help or comment would be greatly appreciated.

[KrisHedges]

Ok. So I figured out the issue I was having not sure what the solution is though... webkit will report a proper scrollTop() value on $('body') but will always be 0 on $('html') and FF will report a proper scrollTop() value on $('html') but will always be 0 on $('body'). Seems like a bit of the ole catch-22. Using $('body,html') doesn't work only the last el seems to be applied resulting in it working in FF but not chrome meaning: reversing to $('html,body') results in it working in webkit nut not FF. So... it seems an additional browser check may be necessary...?

[andrewhavens]

I also need to animate the scrollLeft attribute. I haven't found any plugins that animate the scrollLeft so if you find any, can you please post a link? Thanks!

[fangmingcong]

$("body").animate({scrollTop:$(".everybody_say").offset().top},1000);

Uncaught TypeError: $(...).animate is not a function

How to solve?

[gingerbeardman]

Do you have zepto included in your document head?

On Tuesday, 31 May 2016, fangmingcong notifications@github.com wrote:

$("body").animate({scrollTop:$(".everybody_say").offset().top},1000);

Uncaught TypeError: $(...).animate is not a function

How to solve?

— You are receiving this because you were assigned. Reply to this email directly, view it on GitHub https://github.com/madrobby/zepto/issues/392#issuecomment-222632525, or mute the thread https://github.com/notifications/unsubscribe/AADBzGbEkunh6ten7tNYuNICSeXcwUzOks5qG_oVgaJpZM4AJXwq .