Jan 24
Javascript Bildergalerie mit Slideshow Effekt
Dieser Beitrag richtet sich an alle, die ihre Webseiten mit einer eleganten, animierten Bildergalerie aufpeppen möchten.
Die Web2.0 Bildergalerie “slideshow” von pathfusion bietet dafür einen nützlichen Funktionsumfang. Sie ermöglicht es, die Einzelbilder mit Effekten wie fade (überblenden), wipe (verschieben) und slide (überdecken) zu wechseln.
Die Integration und Konfiguration des Scripts ist sehr einfach.
Zuerst müssen die benötigten Javascript-Dateien im Header eingebunden werden.
<link rel="stylesheet" type="text/css" href="slideshow.css" media="screen" /> <script type="text/javascript" src="mootools.js"></script> <script type="text/javascript" src="backgroundslider.js"></script> <script type="text/javascript" src="slideshow.js"></script>
Konfiguriert wird das Script wie folgt:
var obj = {
wait: 3000, /*Wartezeit bis zum Bildwechsel*/
effect: 'fade', /*Effekt*/
duration: 1000,
loop: true, /*als Endlosschleife abspielen (ja / nein)*/
thumbnails: true, /*Vorschaubilder nutzen (ja / nein)*/
backgroundSlider: true, /*die bachgrundslider-Klasse für Vorschaubilder nutzen (ja / nein)*/
onClick: function(i){alert(i)} /*Funktionsaufruf, wenn ein Bild angeklickt wird*/
}
/*ein neues Objekt der SlideShow-Klasse erstellen*/
show = new SlideShow('slideshowContainer','slideshowThumbnail',obj);
Den restlichen, zugehörigen HTML Code entnehmt ihr der slideshow Projektseite.
Die Galerie benötigt das Javascript Framework mootools und ist mit Firefox 2, IE 6, IE 7 und Safari kompatibel.
Ich habe eine Demoseite erstellt, auf der ihr euch den gesamten Funktionsumfang anschauen und testen könnte. Über die Formularelemente auf der rechen Seite können die Parameter der Galerie variiert werden.
Auf das Bild Klicken, um zur Demoseite zu gelangen:
Januar 28th, 2008 at 11:50 pm
Hey.. habe das hoffentlich richtig eingebunden klappt aber leider nicht. habe den slideshowcontainer und den thumbnail container aber die slideshow startet einfach nicht stattdessen klickt man auf die Thumbnails und es öffnet sich ein Fenster mit den eigentlichen Bildern, aber in euren Beispielen verlinkt es am ende überhaupt nichts beim klick.. was mache ich falsch?
Januar 29th, 2008 at 1:13 am
Hallo,
der Link greift nur dann, wenn das Javascript nicht funktioniert.
Hast du die Javascript-Dateien (mootools.js, backgroundslider.js, slideshow.js) herunter geladen und in deine Seite eingebunden?
Hast du auch den Javascript-Code zum Starten der Slideshow unter “thumbnails” innerhalb von “slideshowContainer” eingebunden?
<script type="text/javascript"> window.addEvent('domready',function(){ var obj = { ... } show = new SlideShow('slideshowContainer','slideshowThumbnail',obj); show.play(); }); </script>Wenn du es dennoch nicht zum laufen bekommst, kann du deine Seite mal zeigen.
Januar 29th, 2008 at 9:04 am
Also meine ganzen Dateien befinden sich in nur einem Ordner.
Dateien:
index.html
style.css
slideshow.css
slideshow.js
backgroundslider.js
mootools.js
Ich habe in index html:
im Head:
im Body:
Play | Stop | Next | Previous
window.addEvent(‘domready’,function(){
var obj = {
wait: 3000, /*Wartezeit bis zum Bildwechsel*/
effect: ‘fade’, /*Effekt*/
duration: 1000,
loop: true, /*als Endlosschleife abspielen (ja / nein)*/
thumbnails: true,/*Vorschaubilder nutzen (ja / nein)*/
backgroundSlider: true, /*die bachgrundslider-Klasse für Vorschaubilder nutzen (ja / nein)*/
onClick: function(i){alert(i)} /*Funktionsaufruf, wenn ein Bild angeklickt wird*/
}
/*ein neues Objekt der SlideShow-Klasse erstellen*/
show = new SlideShow(‘slideshowContainer’,'slideshowThumbnail’,obj);
show.play();
});
Könnte es daran liegen, dass ich 2 css Dateien verlinkt habe?
Aber du meintest ja es muss am JavaScript liegen.
Januar 29th, 2008 at 9:07 am
nebenbei:
wie kann ich den code in den Kommentaren anzeigen lassen?.
und
ich habe es ausprobier ohne style.css einzubinden aber es ist komplett das gleiche.. dann muss es an den Java scripts liegen.
Ich probiers nochmal
Januar 29th, 2008 at 9:09 am
ich Habe von Mootools nur die Core. Reicht das oder brauche ich noch mehr
Januar 29th, 2008 at 9:12 am
>.< sry für das ganze Spammen ^^ war mein Fehler, mit der Vollen Mootools klappt es . Trotzdem Danke nochmal der Blog hier ist es Klasse
Januar 29th, 2008 at 11:30 am
Es freut mich/uns zu hören, dass du es hinbekommen hast. Danke sehr, wir geben uns Mühe noch besser zu sein. Bezüglich der Darstellung von Code in Kommentaren werden wir eine Lösung finden.
Die Core-Komponente die das Herzstück von mootools, sie enthält Basis- und Initialisierungs-Funktionen und wird von allen anderen Komponenten benötigt. Wenn ich das richtig sehe, nutzt slideshow die Effekt-Komponenten “Fx.Transitions” und “Fx.Styles”. Diese Komponenten benötigen wiederum andere Komponenten. Wählt man also auf der mootools Downloadseite Core, Fx.Transitions und Fx.Styles aus, werden die restlichen, benötigten Komponenten automatisch angewählt.
Februar 18th, 2008 at 3:01 pm
Hallo, erstmal ein kompliment an deine Page!
Ich habe ein Problem. habe das script so eingebunden wie beschrieben. Lokal auf mein rechner funzt alles aber wenn ich die seite aufn server lade geht nix. Worann kann es liegen?
bitte helft mir!!!
hier der link zur page: http://www.reptilien-zucht.de/unsere-leos.html
Februar 23rd, 2008 at 7:09 pm
Hallo,
Super Slideshow !!
Hab mal ne (dumme ? ) Frage – ich versuche die Slideshow für eine Ebay Galerie einzubinden aber ich darf den Code
” onClick: function(i){alert(i)} ” (also den Befehl onClick)
nicht verwenden. Sicherheitsgründe bei Ebay.
Kann ich diesen Befehl umgehen oder entfernen ???
Probiere hier schon ewig rum aber ohne Erfolg.
Hat Jemand eine Idee – wäre Super
Gruß Jörg
Februar 25th, 2008 at 12:23 am
@Jörg
Sicher kannst die das onclick Event für die einzelnen Bilder herausnehmen, aber ich glaube nicht das du die Bildergalerie bei eBay zu laufen bekommst. eBay verbietet schon lange zahlreiche JavaScript Funktionen siehe hier, weil damit zu viele böswillige Dinge getrieben wurden.
Februar 29th, 2008 at 8:09 pm
Hallo,
ein tolles Script das bei mir offline auch wunderbar läuft aber online will es einfach nicht. Pfade etc sind richtig, Dateien sind an den richtigen Stellen (sonst würde es offline auch nicht laufen) aber online bleibts tot. Hab inzwischen keine Vermutungen mehr…
http://www.chromax.de/blame/galerie-show.html
Februar 29th, 2008 at 10:58 pm
Ich möchte die Slideshow gerne ohne Thumbnails unterhalb des großen Bildes verwenden. Wenn ich den entsprechenden Parameter ( thumbnails: true, /*Vorschaubilder nutzen (ja / nein)*/ )allerdings auf “false” setze, werden überhaupt keine Bilder mehr angezeigt.
Hat jemand eine Idee was ich das falsch mache?
lg Tom
März 4th, 2008 at 3:36 pm
@mott: Das Problem hatte ich auch. Ich habe es dadurch gelöst, dass ich statt der Thumbnails etwas anderes eingefügt habe, nämlich Zahlen, Wörter oder Texte: Mal sind die Bilder durchnummeriert 1, 2, 3, usw. Mal habe ich geschrieben, was auf den Bilder zu sehen ist. Das sind dann einzelne oder auch mehrere Wörter. Wichtig dabei: Da die Zahlen/Wörter die Stelle der Thumbnails einnehmen, muss der entsprechende Parameter auf “true” gesetzt werden.
Ich persönlich finde es gut, wenn man gezielt einzelne Bilder der Slideshow anwählen kann, egal ob über Text oder Thumbnail. Außerdem sieht jeder Besucher sofort, wie viele Bilder die Slideshow umfasst. Dazu kommt, dass ich mit Hilfe des Textes gezielte Informationen über jedes einzelne Bild geben kann, also quasi eine Bildunterschrift schreibe. Meiner Meinung nach sind viele Bilder ohne eine zusätzliche Information nur die Hälfte wert.
Das Menü habe ich dafür aber gekürzt, indem ich die Links “Vorheriges” und “Nächstes” weggelassen habe. Das halte ich für vertretbar, weil man schließlich jedes Bild einzeln anwählen kann.
Mai 20th, 2008 at 4:38 pm
Hallo Leute, wirklich ein sehr schönes Script – lief auf Anhieb. Meine Frage: Gibt es eine Möglichkeit einen Link einzubinde, so das man auf eine externe URL weitergeleitet wird (egal ob auf die großen Bilder oder die Thumbs)? Viele Grüße!
Mai 29th, 2008 at 9:25 am
Morgen,
mal ne Frage ich habe jetzt Bilder die einwenig größer sind ich würde die aber gerne auf der vorgegeben Größe darstellen lassen. Gibt es da eine Möglichkeit dies leicht zu bewerkstelligen?
mfg Chris
Mai 29th, 2008 at 10:01 am
Hallo Chris,
automatisch geht das leider nicht, da slideshow direkt auf die Bilder auf dem Server zugreift. Du müsstest deine Bilder also mit einen Bildbearbeitungsprogramm zurecht schneiden. Oder halt ein php-Script bauen, welches automatisch die Bilder verkleinert bzw. auf das gewünschte Bildformat zurecht schneidet.
Mai 29th, 2008 at 10:03 am
Ahh das ist ja blöd. Gibt es denn nicht so eine möglichkeit wie mit dem html tag das ich die größe einfach vorgebe?
Problem ist ich habe natürlich schon “einige” Bilder drauf zu denen es auch Thumbs gibt abe rhalt nicht noch eine mittel-version.
mfg Chris
Mai 29th, 2008 at 10:34 am
Bei den Thumbnails würde das gehen, weil diese über den <img> Tag eingebunden werden. Auf die großen Bilder wird nur verwiesen, womit müssen diese auch in der richtigen Größe vorliegen. Möchtest du denn so viele Bilder für die Galerie nutzen, sodass es viel Aufwand macht die Bilder mit einer Software zu bearbeiten?
Mai 29th, 2008 at 10:59 am
Naja es sind schon einige Bilder da diese auch in Unterschiedlichen Ordnern liegen. Auf diese Bilder würde ich dann quasi als Galerie zugreifen. Naja ich muss mir dann halt nen kleines PHP Script schreiben was mir alle meine Bilder in eine bestimmte Auflösung bringt.
Juni 4th, 2008 at 12:56 am
[...] ist eine javascript-Geschichte, ein
Juli 14th, 2008 at 9:01 am
Ich habe mit der Slideshow das gleiche Problem wie andere vor mir auch. Wenn ich es offline teste dann klappt alles – sobald ich es auf dem Webserver habe, dann läuft die Bildershow nicht mehr. Mozilla bringt über die Fehler-Console nur den Hinweis: Backgroundslider is not defined (slideshow.js). Kann mir jemand hier weiterhelfen ?
Juli 14th, 2008 at 10:28 am
Diese Fehlermeldung kommt, weil die Initialisierung des Backgroundsliders fehl schlägt.
Das bedeutet, dass die Klasse nicht gefunden wird. Ich habe bei dir die Javascript-Files im Header überprüft. Du verweist auf backgroundslider.js, doch http://www.cms-beta.de/backgroundslider.js wird nicht gefunden, hier liegt der Fehler.
Juli 14th, 2008 at 11:48 am
Danke für die Antwort. Habe gerade eben nochmals kontrolliert; aber im Root-Verzeichnis liegen außer der eigentlichen html-Datei noch die Dateien : backgroundSlider.js , mootools.js , slideshow.js sowie slideshow.css.
Somit kann es doch daran auch nicht liegen – was mich einfach verwundert ist, dass es offline(lokal) geht … an was kanns sonst noch liegen ?
Juli 18th, 2008 at 10:54 am
das Problem mit dem BackgroundSlider liegt an der Groß- und Kleinschreibung. Am besten alles klein schreiben, dann sollte es klappen (auch im Script ändern!)
Ich habe noch eine Frage an die Experten: Ich würde die Slideshow gerne ohne die Thumbnails laufen lassen. Laut Beschreibung kann man auch ein Array mit img src einbinden. Ich kriege das aber irgenwie nicht gebügelt: sobald ich backgroundslider auf false setze, spielt das ganze nicht mehr. Irgendwelche Vorschläge?
Juli 23rd, 2008 at 1:49 pm
Das geht nur lokal aber nicht im i-net voll die verarsche
Juli 23rd, 2008 at 2:02 pm
Das es nicht funktioniert liegt doch an dir. Wenn man alles richtig macht, funktioniert es lokal und auch online. Wenn du’s nicht glaubst, überzeug dich mit unserer Demo: http://www.ajaxschmiede.de/demos/slideshow/
Juli 23rd, 2008 at 3:08 pm
Ja kann ja sehe ich auch, aber ich kapiers nicht warum das lokal bei mir jetzt einwandfrei funktioniert und im Internet so, dass er etwas immer überspringt oder ab und zu neu geladen muss, damit es wieder geht.
Gibt es was spezielles bei den Fotos zu beachten?
Juli 29th, 2008 at 12:55 am
Kann mir jemand helfen?
Safari (zumindest an meinem Mac) lädt auf der “default” Homepage die Slideshow nicht. Wenn ich zusätzlich /index.html eingebe, einwandfrei. Firefox ist kein Problem.
Hier ist der link http://www.lalanova.com/jason
Vielen Dank, Kat
Juli 29th, 2008 at 9:28 am
Hallo Kat, ich habe mir deine Seite angesehen und habe das von dir beschriebene Problem ebenfalls mit dem Safari unter Windows. Bin erstmal auch ratlos, warum es da Schwierigkeiten gibt. Werde es mir heute noch näher ansehen.
Juli 29th, 2008 at 12:34 pm
Hallo zusammen! Erstmal muss ich sagen, das hier ist echt ein super Tool, dennoch hab ich ein kleines Problem. Ich möchte gerne zu jedem Bild noch einen kurzen Text mit ausgeben. Kann man das irgendwie realisieren?
Juli 29th, 2008 at 8:00 pm
Ja, das kann man realisieren. Ich würde dir anbieten es umzusetzen. Wenn du Interesse hast, setze dich per Kontaktformular mit mir in Verbindung.
August 3rd, 2008 at 7:46 pm
Sehr, sehr geiles Script! Ist wirklich unheimlich genial!
Aaaaaber (vollkommen laienhaft und unwissend): was mache ich denn nun, wenn ich Bilder habe, die mal im Quer-m mal im Hochformat sind? Die Positionierung immer oben links ist etwas blöde dafür… Wie kann ich denn die Bilder zentriert (vertikal, wie auch horizontal) anzeigen lassen?
August 15th, 2008 at 6:19 pm
Hallo Patrick,
Hattest du mal Zeit, dir mein Problem naeher anzusehen?
Danke, Kat
August 15th, 2008 at 8:42 pm
Hallo,
ich bin gerade dabei die Slideshow zu einem Modul für das CMS REDAXO umzubauen,
ich hab nur ein Problem.. wenn ich den Image Ordner änder dann funzt es nicht mehr..
wie gebe ich denn an aus welchem verzeichnis er die Bilder auslesen soll??
viele Grüße,
Jens
September 21st, 2008 at 9:58 am
Hallo,
unter welcher Lizenz darf man das Skript verwenden? Ist das frei? Oder für kommerzielle Nutzung das ist nicht ganz kostenlos?
September 21st, 2008 at 3:57 pm
Das Script steht unter der Open Source MIT Lizenz. Was genau zu beachten ist, ist auch hier auf Wikipedia erklärt.
September 24th, 2008 at 10:26 pm
sehr geiles script… allerdings hab ich das gleiche problem wie jens.
ich würd auch gern wissen wo ich den pfad von images auf x-bleliebiges ändern kann?!!
September 24th, 2008 at 10:29 pm
achja, falls es noch leute interessiert warum die sachen lokal laufen und auf dem webserver nicht… ich habe auch ewig gesucht und es lag an der groß/ kleinschreibung der bild-dateinamen…
hoffe es hilft…
Oktober 11th, 2008 at 2:07 pm
[...] Bild langsam austauschen Wenn du die dazugeh
Dezember 2nd, 2008 at 8:53 am
Hi, kann mir mal jemand sagen, was hier falsch läuft? Ich habe das komplette skript hochgeladen um es einfach mal testweise laufen zu lassen … aber es funktioniert online nicht. Offline klappt alles … was mache ich falsch?
Vielen Dank!
Dezember 11th, 2008 at 10:19 am
Hallo, kann man die Pixelzahl des großen Bildes erhöhen, derzeit 450x360px, bräuchte eine breite von 770px
Danke, im voraus!
Dezember 15th, 2008 at 11:54 pm
Hallo, hab in der slideshow.css die px nun größer eingestellt, aber leider werden die Bilder 1-8.jpg immernoch in der alten Größe dargestellt.
Wenn ich dem Bild den Namen 9.jpg gebe dann wirds größer angezeigt, was muß “refreshed” werden, den cache vom IE löschen alleine reicht nicht aus.
Vielen Dank, im voraus!
Januar 27th, 2009 at 2:14 pm
Hallo,
die Slideshow ist so schön. Ich habe sie heruntergeladen und auf meinem Rechner läuft sie. Übertrage ich das Ganze dann auf den Server erscheinen die kleinen Bilder und anstelle der großen Bilder erscheint nur das Ladesymbol. Was mache ich falsch?
Viele Grüße
Ulrich
Januar 27th, 2009 at 2:21 pm
Hallo erneut,
ich habe die Dateinamen im index.htm von
auf
geändert, und nun gehts.
Danke und Gruß
Ulrich
März 11th, 2009 at 12:12 am
Hi! Das script läuft bei mir soweit 1a! Mich würde nun noch interessieren, wie du die “Optionen” für die slideshow rechts neben das Slideshow-Fenster bekommen hast? ich habe alles komplett mit in meiner html-datei centriert, und nun sind (1:1 aus deinem Quelltext kopiert) die Optionen unterhalb der thumbs…
März 11th, 2009 at 3:40 am
Hallo Adrian,
das ist über div-Container und CSS-Befehle gelöst. Du kannst dafür natürlich auch eine Tabelle nutzen, wenn du die mit den CSS-Positions-Anweisungen nicht auskennst.
März 13th, 2009 at 8:20 pm
würdest du mir deine css-datei evtl zur verfügung stellen? damit ich ein muster hab, wie’s gemacht werden muss :> wär echt nett!
März 20th, 2009 at 4:19 pm
Ich habe das gleiche Problem, ich lade die Website hoch und das Script funktioniert nicht, jedoch lokal alles prima. Ich habe mir alle Beiträge jetzt schon 2 mal durchgelesen. Die Website als Test findet ihr hier:
http://zella-mehlis-community.de/heg/bg_schulrundgang/bg/
Vielen Dank im Voraus!
herbert
März 27th, 2009 at 7:49 pm
good job Arno
April 4th, 2009 at 9:24 am
Hallo zusammen,
ist es möglich mehrere Bilder (z.B. 24) so einzubinden, dass ich versch. Archive unter dem Bild (in diesem Fall 3) mit jeweils 8 Bildern habe? Dies soll verhindern, dass alle 24 Dateien auf einmal angezeigt werden.
Grüße
Hans
April 4th, 2009 at 3:03 pm
Hallo Hans,
du meinst der User soll durch Anklicken auswählen, welches Archive er als Slideshow ansehen möchte und dann werden diese 8 Bilder abgespielt? Oder wie stellst du dir das vor?
April 6th, 2009 at 9:25 am
ich hab beispielsweise seite X mit 24 Bildern dazu
ich möchte aber lediglich 8 bilder unter dem “großen” Bild angezeigt haben und dann via “weiter” oder [1] [2] [3] zu den anderen Bilder gelangen. Es sollen also immer 8 Bilder unter dem großen Bild angezeigt werden. Beim klick auf [2] sieht man dann die nächsten 8 Bilder. bei [3] die nächsten 8, usw.
April 6th, 2009 at 10:32 pm
hey Leute,
ist es möglich das script 2 mal auf einer seite einzubinden?
Möchte 2 Gallerien untereinander laufen lassen.
Michi
April 6th, 2009 at 10:41 pm
ja, das sollte möglich sein. man müsste nur zwei container, 2 bildergalerien und 2 aufrufe machen. die id’s und class-Namen müssen nur unterschiedlich sein. Aurufe entsprechend anpassen!
April 11th, 2009 at 11:21 am
Ich bekomme das nicht hin.. was/wo genau muss ich alles ändern?
April 23rd, 2009 at 8:51 pm
Hat jemand noch einen Tip für mich?
Mai 4th, 2009 at 8:25 am
Vielen Dank für dieses wertvolle Script.
Zur Info für alle, die die Thumbnails nicht benötigen:
im Script slideshow.js in der Funktion initialize (Zeile 60) “imageList.push(el.src);” durch “imageList.push(el.href);” ersetzen. Dann funktioniert auch die Darstellung ohne die Thumbs.
Mai 7th, 2009 at 10:01 am
scheinbar bin ich auch zu blöd. Bei mir funktioniert das ganze offline auch super und wenn ich das Ganze auf den Server lade nicht mehr. Habe ich hier was überlesen, aber ich habe hier keine Antwort darauf gefunden.
die Bildnamen habe ich übrigens schon umbenannt, aber es tut sich nichts, die Slideshow startet nicht.
hier ist übrigens der Link: http://www.schrobenhauser.de/neu/html/referenzen.html
Mai 7th, 2009 at 11:18 am
habe es jetzt auf nem anderen Server getestet, da geht’s.
Mai 13th, 2009 at 2:31 pm
Hallo Ich suche einen ganz normale Bildlaufleiste als Slideshow Gallerie für eine Html Seite. Doch niemand gibt mir den Code freiwillig bzw. ohne Hintergedanken. (.z.b. Werbeeinblendungen).
Die Bilder möchte ich gerne extern in einen Ordner verwalten.
Von Vorteil wäre es auch wenn die Laufleiste sich von links nach rechts bewegen würde.
Vielen Dank
Ein Nurter
Mai 28th, 2009 at 1:01 pm
ist superklasse die slideshow!!! 1000Dank dafür! Klappt alles perfekt.
Gibt es eine Möglichkeit es auch für den IE8 lauffähig zu machen? das geht ja leider nicht.
Wäre sehr sehr dankbar für etwaige Hilfe.
Juli 12th, 2009 at 4:56 pm
warum es online nicht geht? weil das script backgroundSlider.js heisst und hier im tutorial als backgroundslider.js mit einem kleinen “s” eingebunden ist. Bin auch fast verzweifelt und schon mit sachen um mich geworfen.
Juli 24th, 2009 at 4:47 pm
das script an sich ist super.
ist es möglich den titel der img-datei auszulesen und durch ein div an einen bestimmten ort wiederzugeben?
August 6th, 2009 at 12:16 pm
Hi,
weiß jemand wie ich die Slideshow abstellen kann? Also ich möchte quasi nur durch das anklicken der Thumbs die Bilder wechseln. Ist sowas möglich?
Wäre sehr dankbar für ein bisschen Hilfe!!!
September 8th, 2009 at 9:04 am
Ich habe zwei Bildergalerien auf meiner Website. Die Bildunterschrift und der Text müssen aber im Bild integriert sein.
Das ist sehr umständlich, zumal Photoshhop die dazugeladene Schrift nicht verwendet. Also arbeite ich mit Photoshop und Corel, usw.
Also ziemlich umständlich.
Schön wäre es, in der Bildergalerie die Bildunterschriften und Texte extra anzubringen.
Wie kann ich das machen?
Ich wäre sehr glücklich, wenn ich einen Tipp bekäme.
September 12th, 2009 at 9:18 pm
@Annette
Diese Funktionalität gibt es leider nicht. Das müsste in der Slideshow ergänzt werden.
Du kannst uns dafür gern mal eine Anfrage senden, über dieses Formular: http://www.ajaxschmiede.de/programmierung/
September 17th, 2009 at 9:22 am
@Bernd M. Walter : Vielen Dank für Deinen Tipp mit der Codeänderung damit es ohne Thumbnails klappt!
Oktober 6th, 2009 at 5:53 pm
Hallo liebes Ajaxschmiede-Team!
Ich habe die Slideshow dank eurer Tipps erfolgreich integriert, habe aber ein Problem: Da ich die Thumbs untereinander und nicht nebeneinander anzeigen lasse, wird das aktuelle Bild immer neben den anderen und nicht an seinem Platz angezeigt (s. Screenshot: http://tinyurl.com/ycspr4f). Was muss ich ändern, damit das Bild auch in der Reihe und nicht daneben angezeigt wird?
Vielen Dank und Grüße,
Alex
Dezember 7th, 2009 at 9:48 pm
Leute wenn ihr die Thumbnails ausgeblendet haben wollt, versucht es einfach mit:
#thumbnails { display: none; }
Hoffe konnte euch damit helfen, bei mir klappt es einwandfrei in jedem Browser ab IE6.
Januar 7th, 2010 at 12:23 pm
Hallo Ajaxschmiede-Team!
Gibt es schon Neuigkeiten was die Lauffähigkeit im IE 8 betrifft?
Januar 13th, 2010 at 3:49 pm
Hallo,
wie kriegt man es realisiert, dass die Slideshow die Thumbs nicht nacheinander ansteuert, sondern nach dem Zufallsprinzip (random)?
Hoffe, es kann mir jemand einen Tip geben.
Januar 15th, 2010 at 2:32 pm
Keiner???
Februar 5th, 2010 at 2:57 pm
[...] [...]
März 24th, 2010 at 1:46 pm
Hi,
ich habe versucht zwei Galerien auf einer Seite laufen zu lassen (Fotos-Text-wieder Fotos). Dabei bin ich nach Post 54 vorgegangen, leider ohne Erfolg.
Könnt Ihr mir vielleicht mal auf die Sprünge helfen, was ich falsch gemacht habe?
Es erscheinen die Bilder nur in dem ersten Galeriefenster, der farbige Marker aber, wechselt runter zum zweiten Block und zeigt die Bilder von dort aber nur oben in dem ersten Galeriefenster.
Was mache ich noch falsch?
LG
Heike
März 31st, 2010 at 1:35 pm
Ich habe auf meiner Site ein “Pic of the day”, das fuer jeden Wochentag ein anderes Foto anzeigt. Da mir dies mittlerweile zu langweilig geworden ist, moechte ich an der Stelle eine Slideshow laufen lassen. Beim Forschen nach den Moeglichkeiten bin ich auf Eure Seite gestossen. Erst mal Glueckwunsch fuer diesen Auftritt mit jeder Menge Code und Tipps.
Die Diashow soll allerdings ohne die Thumnails darunter erscheinen. Einfach nur ein Fotorahmen. Wie kriege ich das hin. In den html.- und js.-Dateien habe ich ein wenig rumgespielt, jedoch keine Moeglichkeit gefunden ausschliesslich das grosse Bild mit Ueberblendeffekt darzustellen. Wie kriege ich die Vorschaubilder weg?
Beste Gruesse, Jens
April 26th, 2010 at 2:58 pm
Hallo ich bin heute zum Glück auf dieses Skript bzw. die Möglichkeit gestoßen,
eine Slide Show umsetzen zu können. Noch funktioniert nicht alles, aber vielleicht kann
mir jemand helfen.
Ich nutze:
- Mootools 1.2.4 uncompressed
- phatfusion: slideshow backgrounslider.js V1.1
- slideshow.js 1.3
- slideshow.css 1.3
Die Dateien habe ich in mein Verzeichnis kopiert und html folgend eingestellt:
window.addEvent(‘domready’,function(){
var obj = {
wait: 3000, /*Wartezeit bis zum Bildwechsel*/
effect: ‘fade’, /*Effekt*/
duration: 1000,
loop: true, /*als Endlosschleife abspielen (ja / nein)*/
thumbnails: true, /*Vorschaubilder nutzen (ja / nein)*/
backgroundSlider: true, /*die bachgrundslider-Klasse für Vorschaubilder nutzen (ja / nein)*/
onClick: function(i){alert(i)} /*Funktionsaufruf, wenn ein Bild angeklickt wird*/
}
/*ein neues Objekt der SlideShow-Klasse erstellen*/
show = new SlideShow(‘slideshowContainer’,'slideshowThumbnail’,obj);
});
Jetzt erhalte ich die Fehlermeldung:
Fehler Zeile 142 slideshow.js Asset ist undefiniert.
Würde das Skript gerne zum Laufen bekommen, da schöne Sache.
Danke für Hilfe Grüsse Hili
Juni 11th, 2010 at 2:51 pm
hi, was muss ich tun, damit die slideshow nicht direkt losläuft sondern erst durch den play button ausgelöst wird?
danke, jan
Juli 11th, 2010 at 6:19 pm
Guten Abend.
Ich habe die Sliedeshow am Laufen und finde sie ist super! Ich habe nur eine Frage. Wie kann man den Sliedeshowcontainer so einstellen das er sich Autoatisch an das Seitenverhältniss des Bildes anpasst. Ich habe Hochformate und Querformate in meinen Ordner.
Juli 28th, 2010 at 9:52 am
hi,
in der beschreibung steht, dass die slideshow nur bis IE7 kompatibel ist. jetzt gibts aber ja auch den 8er und da läuft sie leider nicht ? es gibt wohl ein problem im backgroundSlider.js.
kann man das beheben und wenn ja wie ?
danke. martina
August 22nd, 2010 at 8:50 am
Ich möchte die Slideshow gerne ohne Thumbnails (oder auch ohne Link-Texte) unterhalb des großen Bildes verwenden. Wenn ich den entsprechenden Parameter ( thumbnails: true, /*Vorschaubilder nutzen (ja / nein)*/ )allerdings auf “false” setze, werden überhaupt keine Bilder mehr angezeigt.
Hat jemand eine Lösung?
September 7th, 2010 at 9:48 am
Hat hier jemand eine Lösung für Motools 1.2?
Wäre genial!
Vielen Dank!