1

好的，我这里只需要一盏灯。

我只想制作一个视觉效果，就像这个网站右侧的微笑图像一样。

http://iitweb.com/

基本上是带有随机 alpha 的网格平铺效果，在图像上连续打开和关闭。有什么想法可以用来做这个吗？

4

1 回答 1

0

Well, this may be a little late for you but it might help anyone looking for the same thing.

This would be my first approach:

HTML

<img src="https://profile-b-ord.xx.fbcdn.net/hprofile-ash3/27537_111050195577875_7540_q.jpg" alt="" />
<img src="http://profile.ak.fbcdn.net/hprofile-ak-snc7/369585_100004094319706_2126721826_q.jpg" alt="" />
<img src="http://vialibrepl.com/wp-content/uploads/2013/08/THUNDERCATS-50x50.jpg" alt="" />
<img src="http://www.brainzum.com/wp-content/uploads/2013/02/Inspector-Gadget-Go-Go-Gadget-Collection1-50x50.jpg" alt="" />
<img src="http://spe.fotolog.com/photo/46/54/51/_melizita/Homer_Simpson_1240210329589_t.jpg" alt="" />

JS

function fadeRandomTile()
{
    var tiles = $("img").length;
    var random_tile = Math.floor(Math.random() * tiles);
    var $tile = $("img").eq(random_tile);

    if(!$tile.data("alpha"))
    {
        $tile.fadeTo(500, 0.5).data("alpha", true);
    }
    else
    {
        $tile.fadeTo(500, 1).data("alpha", false);
    }
}

setInterval(function(){fadeRandomTile()}, 1000);

DEMO http://jsfiddle.net/gEpan/1/

于 2013-08-23T18:52:00.487 回答