我有一个包含多个嵌套无序列表的无序列表。我正在尝试为多个嵌套 <ul></ul>
制作动画独立到包含 div 中的随机位置。我有随机位置部分,但它将该位置赋予每个嵌套 <ul></ul>
而不是给每个人一个随机的位置。在下面的 HTML 中,我试图给每个类 mapStart-second
它自己独特的随机位置,在这种情况下,它们都获得相同的位置。
示例 HTML
<ul id="mapStart">
<li id="mapStart-first">
<ul class="mapStart-second">
<li></li>
</ul>
<ul class="mapStart-second">
<li></li>
</ul>
</li>
</ul>
JS/jQuery
jQuery('#mapStart-first').one('mouseenter', function() {
jQuery(this).find('.mapStart-second').fadeIn('slow').animate({
top: Math.floor((Math.random()*aw_positionY)),
left: Math.floor((Math.random()*aw_positionX)),
});
});
变量aw_positionsX
和 aw_positionY 也正在动态设置并正常工作。
最佳答案
您需要一个循环,否则您将向每个动画传递相同的随机值:
jQuery('#mapStart-first').one('mouseenter', function() {
jQuery(this).find('.mapStart-second').fadeIn('slow').each(function() {
$(this).animate({
top: Math.floor((Math.random()*aw_positionY)),
left: Math.floor((Math.random()*aw_positionX)),
});
});
});
关于javascript - 独立为同一类的元素设置动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18881074/