此代码取自 wilq32.googlepages/wilq32.rollimage222,并且应该为图像旋转设置动画。
This code is taken from wilq32.googlepages/wilq32.rollimage222, and is supposed to animate an image rotation.
我无法准确地弄清楚结构,以及如何训练它来做我想要的事情,例如 - make div X在悬停时旋转div Y(而不是自己旋转),或者在动画中添加其他功能,例如淡入淡出。
I can't figure out the structure exactly, and how to train it to do what I want, for example - make div X rotate div Y on hover (instead of rotating itself), or adding other functions such as fade to the animation.
$(document).ready(function() { var rot=$('#image3').rotate({maxAngle:25,minAngle:-55, bind: [ {"mouseover":function(){rot[0].rotateAnimation(85);}}, {"mouseout":function(){rot[0].rotateAnimation(-35);}} ] }); });提前致谢
推荐答案这就是它的作用。 1)等待页面加载$(文档).ready() 2)将rot指定为等于jQuery.rotate对象。 3)然后,此对象绑定到两个不同的事件,mouseover和mouseout。绑定意味着当这些事件触发该段代码时将执行。
Here's what it does. 1) Waits for page load $(document).ready() 2) Assigns "rot" to equal a jQuery.rotate object. 3) This object is then bound to two different events, mouseover, and mouseout. Binding means that when those events trigger that piece of code will execute.
Mouseover启动rotateAnimation(85)并且mouseout设置相同的函数-35。我猜它会反转它所看到的图像的旋转。
Mouseover starts "rotateAnimation(85)" and mouseout sets the same function -35. I'm guessing that it reverses the rotation of the image it's looking at.
要向旋转添加内容,你可以这样做。
To add things to the rotation, you could just do this.
$(document).ready(function() { var rot=$('#image3').rotate({maxAngle:25,minAngle:-55, bind: [ {"mouseover":function(){ rot[0].rotateAnimation(85);} //insert awesome fades and effects here. }, {"mouseout":function(){ rot[0].rotateAnimation(-35);} // insert more cool fades and effects here. } ] }); });希望有所帮助。
更多推荐
有人可以解释这个jQuery代码吗?
发布评论