Auf Thema antworten 2026

Beitrag

<blockquote data-quote="lyzarr" data-source="post: 1560235" data-attributes="member: 167564">Hallo Allerseits!&nbsp;Ich bin auf der Suche nach einer Lösung für einen automatischen Bilderwechsel (slideshow), im Idealfall inklusive Überblendung - wobei das dann wohl doch zu komplex ist.&nbsp;Eine gifs-Animation fällt aufgrund der geringen Farbtiefe weg.&nbsp;Nun habe ich ein java-script gefunden, welches grundsätzlich wie gewünscht funktioniert. Zuvor aber meine ersten Fragen:&nbsp;1.) Ist es heutzutage noch ratsam java-scripts zu benutzen, oder sollte man wenn möglich nicht lieber nach anderen Lösungen Ausschau halten ? (z.B. weil häufig aus Sicherheitsgründen bei den Nutzern deaktiviert.)&nbsp;2.) Kann mir Jemand eine &quot;bessere&quot; Variante statt java-script nennen ?&nbsp;&nbsp;Falls dem nicht so ist, jetzt zu meinem Problem mit dem script.(<a href="http://www.supa-clan.de/test2" target="_blank">Hier die Testversion</a>)&nbsp;Der eigentliche Aufruf des scripts folgt an einer beliebigen Stelle mittels [code]&lt;div id=Bild&gt;&lt;/div&gt;[/code]nun möchte ich aber auf die Position (margin) und Erscheinung (padding + background-image für Rahmen) Einfluß nehmen.Bei einem einfachen Bild erziele ich das mit z.B.[code]&lt;img id=&quot;foto&quot; src=&quot;start_01.jpg&quot; /&gt; [/code]Also mit &quot;id=&quot;foto&quot;, welches auf die entsprechenden Einstellungen in der css verweist.&nbsp;&nbsp;3.) Wie bekomme ich die beiden, den Aufruf &lt;div id=Bild&gt;&lt;/div&gt; und id=&quot;foto&quot; zusammen ?&nbsp;Hier die relevanten code-Teile:&nbsp;html:[html]&lt;script language=&quot;JavaScript&quot; type=&quot;text/JavaScript&quot;&gt;var bilder = new Array();bilder[0] = &quot;start_01.jpg&quot;;bilder[1] = &quot;start_02.jpg&quot;;bilder[2] = &quot;start_03.jpg&quot;;var timer = 3000; &lt;!--Millisekunden--&gt;var arraylaenge = bilder.length;var index = Math.floor(Math.random() * arraylaenge);var Bildstring = &#039;&lt;img src=&quot;&#039; + bilder[index] + &#039;&quot;&gt;&#039;;function Bildwechsel () {if (index == arraylaenge-1) {index = 0;} else {index++;}Bildstring = &#039;&lt;img src=&quot;&#039; + bilder[index] + &#039;&quot;&gt;&#039;;document.all.Bild.innerHTML = Bildstring;setTimeout(&quot;Bildwechsel()&quot;, timer);}function Bildanzeige () {document.all.Bild.innerHTML = Bildstring;Bildwechsel();}&lt;/script&gt;&nbsp;&nbsp;&lt;body onLoad=&quot;Bildanzeige()&quot;&gt;&nbsp;&nbsp;&nbsp;&lt;div id=&quot;pictures&quot;&gt;&lt;div id=Bild&gt;&lt;/div&gt;&lt;/div&gt;[/html]&nbsp;css:[html]#pictures{&nbsp; width: 260px; height: 400px;float:right;margin-left: 5px;margin-top: 64px;text-align: center;&nbsp; color:#000000;/* background-color:#A20D1B; */border: dashed 1px #FFF;}&nbsp;#foto {background: url(images/photo_frame_01.png) no-repeat left bottom;margin-top: 80px;padding: 8px 15px 17px 15px;border: #666 0px solid;border-left:none;border-right:none;border-bottom:none;}[/html]&nbsp;&nbsp;Vielen Dank schonmal im Voraus für Eure Mühe. Gruß,&nbsp;Lyzarr</blockquote>

[QUOTE="lyzarr, post: 1560235, member: 167564"] Hallo Allerseits! Ich bin auf der Suche nach einer Lösung für einen automatischen Bilderwechsel (slideshow), im Idealfall inklusive Überblendung - wobei das dann wohl doch zu komplex ist. Eine gifs-Animation fällt aufgrund der geringen Farbtiefe weg. Nun habe ich ein java-script gefunden, welches grundsätzlich wie gewünscht funktioniert. Zuvor aber meine ersten Fragen: [B]1.)[/B] Ist es heutzutage noch ratsam java-scripts zu benutzen, oder sollte man wenn möglich nicht lieber nach anderen Lösungen Ausschau halten ? (z.B. weil häufig aus Sicherheitsgründen bei den Nutzern deaktiviert.) [B]2.)[/B] Kann mir Jemand eine "bessere" Variante statt java-script nennen ? Falls dem nicht so ist, jetzt zu meinem Problem mit dem script. ([URL="http://www.supa-clan.de/test2"]Hier die Testversion[/URL]) Der eigentliche Aufruf des scripts folgt an einer beliebigen Stelle mittels [code]<div id=Bild></div>[/code] nun möchte ich aber auf die Position (margin) und Erscheinung (padding + background-image für Rahmen) Einfluß nehmen. Bei einem einfachen Bild erziele ich das mit z.B. [code]<img id="foto" src="start_01.jpg" /> [/code] Also mit "id="foto", welches auf die entsprechenden Einstellungen in der css verweist. [B]3.)[/B] Wie bekomme ich die beiden, den Aufruf <div id=Bild></div> und id="foto" zusammen ? Hier die relevanten code-Teile: html: [html] <script language="JavaScript" type="text/JavaScript"> var bilder = new Array(); bilder[0] = "start_01.jpg"; bilder[1] = "start_02.jpg"; bilder[2] = "start_03.jpg"; var timer = 3000;  var arraylaenge = bilder.length; var index = Math.floor(Math.random() * arraylaenge); var Bildstring = '<img src="' + bilder[index] + '">'; function Bildwechsel () { if (index == arraylaenge-1) { index = 0; } else { index++; } Bildstring = '<img src="' + bilder[index] + '">'; document.all.Bild.innerHTML = Bildstring; setTimeout("Bildwechsel()", timer); } function Bildanzeige () { document.all.Bild.innerHTML = Bildstring; Bildwechsel(); } </script> <body onLoad="Bildanzeige()"> <div id="pictures"> <div id=Bild></div> </div> [/html] css: [html] #pictures{ width: 260px; height: 400px; float:right; margin-left: 5px; margin-top: 64px; text-align: center; color:#000000; /* background-color:#A20D1B; */ border: dashed 1px #FFF; } #foto { background: url(images/photo_frame_01.png) no-repeat left bottom; margin-top: 80px; padding: 8px 15px 17px 15px; border: #666 0px solid; border-left:none; border-right:none; border-bottom:none; } [/html] Vielen Dank schonmal im Voraus für Eure Mühe. Gruß, Lyzarr [/QUOTE]

Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.

Authentifizierung

Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?