javascript - 重复图像 - 悬停消失

Question

我正在创建一个“splash”页面，我们需要用一堆特定的图像来填充它。我希望它在悬停时删除每个单独的图像。这就是我所拥有的 - 我已经能够复制图像以填满屏幕 - 但现在当我悬停时，它们全部消失而不是单独消失。有什么想法吗？

是否还有一种方法可以轻松旋转/随机放置克隆体？

<img class='toBeCloned' id="IMAGE_ID" src="image.png" />

<div id='target' class="DIV_CLASS">

<script>
var _clone=$('.toBeCloned');
var _target=$('#target'); //this is target

for(var i=0;i<500;i++){
    _target.append(_clone.clone(true)); //append target, clone every time
};

$(function () {

    $('img').hover(function() {
       $('img').fadeOut("slow");
    });

});
</script>

Answer 1

$('img').hover(function() {
       $(this).fadeOut("slow");
    });

您在 fadeOut 上引用了 img，这将导致所有 img 标签消失。使用 this 只会让悬停的图像消失。