|
|||
Picture Show - Schön und Gut aber wie
Hi Leute
Ich sehe auf vielen Seiten eine Slideshow... Möcht ich Jetzt auch, aber wie? Ich möchte keine großartige Show mit Flummi-Effekten oder ähnlichem, sondern einfach ein Bild weches nach 5sec durch ein anderes ersetzt wird usw... Für 3 bilder. Vieleicht sollten die Bilder aber nicht einfach ausgewechselt werden, sondern übergeblendet werden, also "flüssig" wechseln. Danke schon mal im Voraus |
Sponsored Links |
|
||||
Mit einer Prise "Google" hättest du das auch selbst gefunden...
20 Best jQuery Slideshow / Photo Gallery Plugins Nr. 10 passt meiner Meinung nach mit kleineren Anpassungen ziemlich gut zu deinen Anforderungen.
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau |
Sponsored Links |
|
|||
Ok danke habe jetzt einen Code gefunden!
Jetzt wechseln die Bilder alle 3,5 sec finde ich ok (hab ich ja auch so eingestellt ) ABER nach dem 4ten Bild fängt die Slideshow nicht von vorne an sondern bleibt stehen... hier ist der Code: Code:
<html> <head> <script type="text/javascript"> function fade(step) { var imgs = document.getElementById("meinFader").getElementsByTagName("img"); step = step || 2; imgs[counter].style.opacity = step/100; imgs[counter].style.filter = "alpha(opacity=" + step + ")"; step = step + 2; if (step <= 100) { window.setTimeout(function () { fade(step); }, 10); } else { window.setTimeout(next, 3500); } } function next() { var imgs = document.getElementById("meinFader").getElementsByTagName("img"); if (typeof(counter) != "number") { counter = 0; } counter++; if (counter < imgs.length) { fade(); } }; </script> <style type="text/css"> .next { position: absolute; top: 0; left: 0; opacity: 0; filter:alpha(opacity=0); } #meinFader { position: relative; } </style> </head> <body onload="next()"> <p id="meinFader"> <img src="img/slideshow/1.png" alt="" class="next" /> <img src="img/slideshow/2.png" alt="" class="next" /> <img src="img/slideshow/3.png" alt="" class="next" /> <img src="img/slideshow/4.png" alt="" class="next" /> </p> </body> </html> |
|
||||
Warum nimmst Du nicht einfach das jQuery Plugin?
Zu deinem Code: Wenn dein Counter die Anzahl der Bilder übersteigt, dann sollte er wieder auf Null gesetzt werden. Zitat:
|
|
||||
Jo, sowas hatte ich bei einem meiner Projekte eingesetzt (Maus über Slideshow bewegen) - wird aber leider nicht mehr weiterentwickelt, funktioniert allerdings ganz gut.
__________________
Gruß Roman // ngkreativ.de - Webdesign & Motorradumbau |
|
||||
Vor kurzem mal entdeckt: Slider Kit, sliding contents with jQuery
Ist so eine Art "Universal" Plugin für alle möglichen Slide Funktionen. Manfred |
Stichwörter |
picture show, slideshow |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Gut lesbare Telefonnummer | AndreasB | Barrierefreiheit | 36 | 30.07.2011 01:03 |
picture of the day | Mr.T | Javascript & Ajax | 6 | 24.01.2008 01:32 |
MySQL/PHP: SHOW TABLE STATUS auswerten | RitterRunkel | Serveradministration und serverseitige Scripte | 2 | 15.05.2005 15:51 |
Zeilenumbruch bei horizontal nebeneinanderliegenden divs | GrafZahl | Knowledge Base | 10 | 16.07.2004 16:13 |