jQueryのimg.draggableを使用してアレイからのランダム要素（jQueryのUI）が

Question

Iは、ページ内のランダムな開始位置と3枚のドラッグ可能な画像を印刷するためにこのコードを使用してい

を

<img src="xxx.xxx" class="draggable" width="260px" height="155px"> 
<img src="xxxx.xxx" class="draggable" width="300px" height="225px"> 
<img src="xxxx.xxx" class="draggable" width="225px" height="150px"> 

画像を取得します。

は常に3 GIF画像を得るためにそこの方法ですが、ランダムに大きな配列（例えば10個のGIF要素）から

：（常に3）

今のコードがうまく機能し、私は1つの以上のステップを必要とします

私は関数を追加しようとしましたが、要素はドラッグ可能なクラスを失いました。

だから、私はランダムに開始位置と、ページ上の3つのドラッグ可能な要素を持って、私はすべてのリフレッシュに大きなランダム配列から、これら3つの要素を取得する必要があります。

あなたの興味のための私の貧しい人々のjsと感謝多くて申し訳ありません。

Answer 1

は右$(el).css(...後

$(el).attr('src', genRandomFilename()); 

を行うようにしてください。次に、ドラッグ可能な機能の適用前に画像ソースが設定されます。

Answer 2

画像の数は、すなわち3を固定されている場合は、jQueryのを使用して、SRC画像を変更することができます。それ以外の場合は、jQueryを使用してイメージを作成し、ページに追加できます。次に、jQuery UIのドラッグ可能な関数を適用します。それは動作するはずです。

<script> 
var imgArray = []; 
$(document).ready(function(e) { 
    $("img.draggable").each(function(index, element) { 

     var tLeft = Math.floor(Math.random()*800); 
     var tTop = Math.floor(Math.random()*400); 

      $(element).css({position:'absolute', left: tLeft, top: tTop}); 
      $(element).draggable();  

    }); 
}); 
</script> 


<img src="test.jpg" class="draggable" width="120" height="120"> 
<img src="test.jpg" class="draggable" width="120" height="120"> 
<img src="test.jpg" class="draggable" width="120" height="120">