独立动画具有相同类的元素

时间:2013-09-18 19:48:57

标签: javascript jquery

我有一个包含多个嵌套无序列表的无序列表。我试图将多个嵌套的<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也正在动态设置并正常工作。

1 个答案:

答案 0 :(得分:2)

你需要一个循环,或者你将相同的随机值传递给每个动画:

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)),
        });   
    });  
});