JQuery shuffle: Unterschied zwischen den Versionen

Aktuelle Version vom 9. März 2016, 09:42 Uhr

Möchte man Elemente auf einer Seite in zufälliger Reihenfolge anordnen kann dies mit einem einfach Plugin^[1] realisiert werden.

Dies wurde zum Beispiel bei my-medibook verwendet.

Plugin

Das folgende Script muss einfach in die Seite eingebunden werden.

(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);

Benutzung

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

$('selektor').shuffle();

1. ↑ Shuffle DOM Elements