JQuery shuffle - Versionsgeschichte

Marco Buchholz: Die Seite wurde neu angelegt: „Kategorie:Snippets_(Javascript) Möchte man Elemente auf einer Seite in zufälliger Reihenfolge anordnen kann dies mit einem einfach PluginKategorie:Snippets_(Javascript) Möchte man Elemente auf einer Seite in zufälliger Reihenfolge anordnen kann dies mit einem einfach Plugin<ref name="shuff…“

Neue Seite
[[Kategorie:Snippets_(Javascript)]]
Möchte man Elemente auf einer Seite in zufälliger Reihenfolge anordnen kann dies mit einem einfach Plugin<ref name="shuffle">[https://css-tricks.com/snippets/jquery/shuffle-dom-elements/ Shuffle DOM Elements]</ref> realisiert werden.

Dies wurde zum Beispiel bei [http://dev.my-medibook.de/industriewerbung/innovation-und-kommunikation.html my-medibook] verwendet.

== Plugin ==
Das folgende Script muss einfach in die Seite eingebunden werden.

<pre>
(function($){
$.fn.shuffle = function() {

var allElems = this.get(),
getRandom = function(max) {
return Math.floor(Math.random() * max);
},
shuffled = $.map(allElems, function(){
var random = getRandom(allElems.length),
randEl = $(allElems[random]).clone(true)[0];
allElems.splice(random, 1);
return randEl;
});

this.each(function(i){
$(this).replaceWith($(shuffled[i]));
});

return $(shuffled);

};
})(jQuery);
</pre>

== Benutzung ==
Mit einer einfachen jQuery anweisung, kann nun das vertauschen ausgelöst. Dazu wird ''selektor'' durch das zu vertauschende Element ersetzt.

<pre>
$('selektor').shuffle();
</pre>