Question

我正在以随机顺序在div中插入图像。

我还要随机旋转图像。我有Jquery和jquery的旋转插件，只需输入类似的东西即可 $（ “＃IMG”）旋转（45）;

以下是我的图像随机顺序代码：

var contents=new Array (

'<img class="karkki" class="omenalaku" src="images/omenalaku01.png"      onclick="image_control001();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku02.png" onclick="image_control002();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku03.png" onclick="image_control003();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku04.png" onclick="image_control004();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku05.png" onclick="image_control005();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku06.png" onclick="image_control006();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku07.png" onclick="image_control007();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku08.png" onclick="image_control008();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku09.png" onclick="image_control009();" alt="omenalaku" />',

'<img class="karkki" class="omenalaku" src="images/omenalaku10.png" onclick="image_control010();" alt="omenalaku" />'
);

// insert elements in random order inside the candybox div
var i=0
//variable used to contain controlled random number 
var random

//while all of array elements haven't been cycled thru
while (i<contents.length){
    //generate random num between 0 and arraylength-1
    random = Math.floor(Math.random()*contents.length)
        //if element hasn't been marked as "selected"
    if (contents[random]!="selected"){
        $(".candybox").append(contents[random]);
        //mark element as selected
        contents[random]="selected"
        i++
    }
}

是否可以将随机旋转插入到同一个while循环中？我的尝试导致每个图像具有相同的旋转量。我希望每个图像都有不同的旋转值。

编辑：

这是一个微弱的尝试：

// insert elements in random order inside the candybox div
var i=0
//variable used to contain controlled random number 
var random

//while all of array elements haven't been cycled thru
while (i<contents.length){
    //generate random num between 0 and arraylength-1
    random = Math.floor(Math.random()*contents.length);
    randomrot = Math.floor(Math.random()*360);
    //if element hasn't been marked as "selected"
    if (contents[random]!="selected"){
        $(".candybox").append(contents[random]);
        contents[random].rotate(randomrot);
        //mark element as selected
        contents[random]="selected"
        i++
    }
}

这会导致控制台错误Object <img class="karkki" class="omenalaku src="images/omenalaku03.png" onclick="image_control003();" alt="omenalaku" /> has no method 'rotate'。好像我试图不正确地访问旋转插件到DOM元素，但如何正确地进行操作？

Answer 1

替换这两行：

$(".candybox").append(contents[random]);
contents[random].rotate(randomrot);

用这个：

contents[random].appendTo(".candyBox").rotate(randomrot);

随机插入和随机旋转

1 个答案: