jquery - jQuery 生活元素

Question

有谁知道如何处理http://2crossmedia.com/liv-multicolor/上的效果 如果您单击文本字段，它会被一条变色线包围。代码说它是jquery。但是如何:)？

非常感谢！

Answer 1

这很酷。它使用 3 张图片：

• http://2crossmedia.com/liv-multicolor/images/input-mask.png
• http://2crossmedia.com/liv-multicolor/images/gradient.png
• http://2crossmedia.com/liv-multicolor/images/input-bg.png

蒙版是一个半透明的 png，带有渐变通过的透明部分。所以他们只是淡入面具后面的渐变。然后他们只是使用超时平移它。就像是：

<div id="bg"></div>
<div id="gradient"></div>
<div id="front"></div>

#gradient开始于opacity = 0. 然后你做类似的事情：$("#gradient").fadeIn().

Answer 2

如果您使用 firebug 查看脚本的源代码，您可以看到它们正在为背景图像设置动画。图像是多色的，并且比显示器更宽。他们正在改变图像的位置，以使其产生褪色的错觉。这是他们正在使用的图像。