多次更改css背景位置

时间:2011-03-14 13:31:30

标签: javascript jquery css

您好我想在悬停时预览视频文件的缩略图,例如www.megavideo.com,但我想用精灵文件来完成。 例如:我的拇指是140像素宽和560像素高的图像 当我用鼠标悬停时,想要切换背景位置4次(-140px)并在鼠标悬停时循环该动画。 有人可以帮助我吗?我很抱歉我的英语不好,而且我对jquery感到厌烦。 谢谢!

1 个答案:

答案 0 :(得分:0)

使用$.hover应用一个事件处理程序,使用setTimeout每秒调整background-position属性的一个轴-140px。存储setTimeout的返回值,以便稍后取消它。当该轴的值超过-140 * 4时,其中4是动画的帧数,然后将其重置为0.

您可以使用.hover指定第二个回调函数,当您停止悬停时,该函数会触发;使用该函数取消上次使用clearTimeout设置的回调。