Zufällige html Code Reihenfolge

[0xygenium]

Hallo =)

Ich habe mich vor ein paar Tagen nach einem Blogger Template umgeschaut und habe diesen gefunden.
Matino Blogger Template - BTemplates

Wie ihr sehen könnt, ist dort eine "Slidershow" eingebaut, hier werden Bilder eingeblendet die jeweils auf eine andere Adresse verlinken können.

Mein Probleme ist, dass ich diese Bilder nicht nach der Reihenfolge eingeblendet haben möchte, sondern per Zufall.
Dass ich also zB 100 Bilder einfüge und diese sollen immer in einer verschiedenen Reihenfolge eingeblendet werden.

Ich würde mich sehr freuen wenn sich jemand den Code genauer anschauen könnte und mir dann helfen kann.


Ich habe auch selbst nachgeschaut und habe einen Abschnitt in der HTML Datei gefunden, in dem die ( 3 ) Bilder eingefügt werden, kann man diese 3 Codes nicht so erweitern, dass die Reihenfolge der aufgelisteten Codes sich immer ändert?

<li class='s3sliderImage' id='featured-1'>
<a href='YOUR-URL-HERE'><img alt='' height='283' src='http://1.bp.blogspot.com/_j82W7u9kZbs/S0tvaDXfqKI/AAAAAAAAA5k/ZrdEi3WisBk/s1600/logo+blog+navidades.jpg' width='660'/></a>
<span class='right'><strong><a href='YOUR-URL-HERE'>POST TITLE</a></strong><br/><p>POST DESCRIPTION</p></span>
</li>
                    
<li class='s3sliderImage' id='featured-1'>
<a href='YOUR-URL-HERE'><img alt='' height='283' src='http://4.bp.blogspot.com/_j82W7u9kZbs/S0txWk3Mz1I/AAAAAAAAA50/xt1pJg8hvRo/s1600/anakin_padawan_crop.jpg' width='660'/></a>
<span class='right'><strong><a href='YOUR-URL-HERE'>POST TITLE</a></strong><br/><p>POST DESCRIPTION</p></span>
</li>
                    
<li class='s3sliderImage' id='featured-1'>
<a href='YOUR-URL-HERE'><img alt='' height='283' src='http://3.bp.blogspot.com/_j82W7u9kZbs/S0tvafTUK2I/AAAAAAAAA5s/AeTED4QTW20/s1600/The+Black+Hole.jpg' width='660'/></a>
<span class='right'><strong><a href='YOUR-URL-HERE'>POST TITLE</a></strong><br/><p>POST DESCRIPTION</p></span>
</li>

Größten Dank, wenn sich jemand die Mühe macht mir zu helfen!
Mit freundlich Grüßen 0xygenium =)

 

[Johninho]

In HTML wird das wohl so nicht möglich sein, Javascript dürfte dein "Problem" lösen. Wobei es fraglich ist, ob sich der Aufwand lohnen würde. Es gibt ja bereits vorgefertigte HTML Gallerie-Scripts, die sowas unter anderem schon können. Ich habe noch das hier gefunden: 10 Bilder-Ausgabe

<script type="text/javascript">
document.write('<img src="' + new Date().getTime() % 10 + '.gif">');
</script>
<noscript>
<img src="0.gif" alt="">
</noscript>

 

[0xygenium]

Leider hilft mir dieser Code nicht besonders:sad:

Kennt jemand den schon Scripts für solche "Diashows" (bzw.Slidershows) die einen Zufallsprinzip in der Bilderwiedergabe beinhalten?

 

[mermshaus]

Wahrscheinlich reicht es, wenn du zu Beginn der makeSlider()-Funktion das Array items randomisierst.

Eine entsprechende Funktion gibt es etwa mit diesem jQuery-Plugin: jQuery: Shuffle Plugin | Yelotofu

Dann grob so:

var makeSlider = function() {
            items = $.shuffle(items); // neu
            current = (current != null) ? current : items[(items.length-1)];

 

[crash]

Gleich für so einfache Sachen gleich ein JQuery-Plugin?

items = items.sort(function () { return (Math.floor(Math.random() * 3) - 1) });

Ist gleichzeitig viel schneller.

 

[bandit600]

In HTML wird das wohl so nicht möglich sein

Das hat man 0xygenium auch schon in einem anderen Forum gesagt. Crossposting!

 

[0xygenium]

Größten Dank für eure tolle Hilfe.

Der Code von crash scheint leider nicht richtig zu funktionieren, die Bilder in der Slideshow spielen dann ganz verrückt.

Ich versuche gerade mermshaus's Vorschlag zu befolgen, leider funktioniert das Ganze fast genauso wie mit crash's Vorschlag, die Bilder werden nicht richtig eingeblendet.


Vielleicht kann man ja diese Funktion nicht vor
var makeSlider = function() {

setzen, sondern vor einen anderen Code Bereich, vielleicht bei den Bilder, dass das erste Bild nicht immer das erste Bild sein muss?
Hat da jemand Vorschläge?

Noch einmal ein sehr großes Danke an euch!!

 

[mermshaus]

Du könntest noch mal versuchen, crashs Zeile hier einzufügen:

var items       = $("#" + element[0].id + "Content ." + element[0].id + "Image");
var itemsSpan   = $("#" + element[0].id + "Content ." + element[0].id + "Image span");

items = items.sort(function () { return (Math.floor(Math.random() * 3) - 1) }); // Neu

makeSlider scheint doch nicht der Konstruktor zu sein, wie ich dachte, sondern gleichzeitig auch ein Callback für den Slideshow-Timer.