滚动显示动画 [英] Animate image on scroll

问题描述

我想在滚动页面上循环显示图像，以使对象的效果在您向下滚动页面时顺时针旋转，然后在您向上滚动时逆时针旋转.我已经看过 Jquery Waypoints 插件可以做到这一点，但想知道是否有人知道一种更清洁的方法.

I'm wanting to cycle through the frames of an image on scroll to give the effect of an object spinning clockwise as you scroll down the page, then anticlockwise as you scroll up. I've looked at Jquery Waypoints plugin as a possible way of doing this but wondered if anyone knew of a cleaner way of doing this.

谢谢！

推荐答案

我制作了一个快速脚本，以百分比显示当前滚动位置.
我认为这是从以下位置开始工作的良好基础:

I made a quick script which shows the current scroll position in percent.
I think it's a good base to start working from:

$(function(){ 
    var ms = $(document).height() - $(window).height();

    $(window).scroll(function(){

       var percent = Math.round($(window).scrollTop() / ms * 100); 
    });
});

演示:
http://jsfiddle.net/Z6bxD/

这篇关于滚动显示动画的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！