使2个图像移动,类似于“字幕”样式

时间:2015-06-22 22:32:35

标签: jquery html css image animation

我正在尝试找出一个类似于<marquee> HTML元素的CSS或jQuery样式代码。基本上我正试图在一张照片上获得2张图像,这些图像可以上下左右滑动。 10-15像素,慢慢来。单击一个时,它将停止另一个图像,使屏幕变暗,另外一个弹出窗口将显示单击图片的“生物”。

我已经管理了jQuery / CSS以使屏幕变暗,并且弹出窗口(我想我可能已经比预期更复杂了),但我觉得使用HTML marquee是非常过时。我看了一遍,但找到代码可以解决我要求的问题。没有关键点击或鼠标悬停。 (我不确定如何使用.animate并让它自动运行。还在学习jQuery。

我知道.animate(on.click) [错误的语法,我知道]但我不确定.animate这段时间是如何运作的。我的意思是z.animate(function(){z等可能会起作用 - 但是当我的图像被点击时它会停止吗?

1 个答案:

答案 0 :(得分:0)

在MDN上查看Using CSS transitionsCSS animations

CSS过渡决定了动画的行为,animation可以允许它无限期地持续直到它被点击。由于它可以分配给CSS类,因此应该允许它按照您的需要进行切换,因此要使其停止,只需删除它在图像中定义的CSS类。