0

div内にランダムな順序で画像を挿入しています。

画像もランダムに回転させたいです。私はJqueryとjquery用のrotate-pluginを持っており、$（ "＃img"）。rotate（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要素に誤ってrotate-pluginにアクセスしようとしているようですが、正しく行うにはどうすればよいですか？

4

1 に答える 1

0

次の 2 行を置き換えます。

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

これとともに：

contents[random].appendTo(".candyBox").rotate(randomrot);
于 2012-07-19T23:44:50.050 に答える