滚动时旋转图像

时间:2011-11-02 09:33:04

标签: javascript css animation css3 scroll

在这个网站上http://www.contrastrebellion.com/大概有一半的圆圈根据您向下或向上滚动页面的距离而旋转。如何在不依赖Facebook这样的网站的情况下实现这一目标呢?

2 个答案:

答案 0 :(得分:3)

该功能已在http://www.contrastrebellion.com/public/js/script.js?2

中实施

查看以

开头的代码块
$(window).scroll(function(e) {

它使用jQuery .scrollCSS transformations(包括特定于浏览器的版本)来实现效果。

旁注:它无法在我的主浏览器中执行任何JS魔术,因为我阻止了Facebook域名。故事的道德:不要让你的整个 JS依赖于你的网站功能集的一小部分。

答案 1 :(得分:0)

他们正在使用CSS3属性transform,其旋转值基于当前滚动位置。