Dia Show mit Bildbeschreibung
marco
- javascript
Hallo Leute
Ich habe mit JavaScript eine Dia-Show programmiert, bei welcher mit einem Button von einen Bild zum nächsten gewechselt werden kann. Jetzt möchte ich auch, dass die Bildbeschreibung gewechselt wird... wie macht man dies?
Die Bilder und Bildbeschreibungen (Texte) habe ich in einen Array eingelesen. Wenn ich jetzt den Button für das nächste Bild drücke, wird eine Funktion zum wechseln des Bildes mit dem Object IMAGE ausgeführt und an der entsprechenden Stelle ändert das Bild. Wie programmiere ich den gleichzeitigen Wechsel eines Textes bei Drücken des Buttons?
Vielleich kann mir jemand einen Tipp geben. Vielen Dank.
Gruss Marco
Hallo Marco,
die einfachste Lösung wäre wohl, die Beschreibung mit ins Bild zu nehmen, also einfach mit als Grafik abzuspeichern - hat natürlich auch einige Nachteile (z.B. daß die Grafik größer wird, daß nachträgliche Änderungen aufwändiger werden etc.).
Gruß, Maniac
Hallo Maniac
Diese Variante habe ich mir auch schon ausgedacht, aber ehrlich gesagt gefällt sie mir nicht besonders, wegen den Nachteilen die Du auch erwähnst. Trotzdem vielen Dank für Dein Bemühen.
Gruss Marco
Hallo Leute
Ich habe mit JavaScript eine Dia-Show programmiert, bei welcher mit einem Button von einen Bild zum nächsten gewechselt werden kann. Jetzt möchte ich auch, dass die Bildbeschreibung gewechselt wird... wie macht man dies?
Die Bilder und Bildbeschreibungen (Texte) habe ich in einen Array eingelesen. Wenn ich jetzt den Button für das nächste Bild drücke, wird eine Funktion zum wechseln des Bildes mit dem Object IMAGE ausgeführt und an der entsprechenden Stelle ändert das Bild. Wie programmiere ich den gleichzeitigen Wechsel eines Textes bei Drücken des Buttons?
Da gibt es mehere Möglichkeiten. Die beste, da auf den meisten Browsern funktionsfähig, dürfte es sein die Seite neu zu beschreiben, am besten mit doument.write(), dafür musst du aber ein Frameset oder popup benutzen.
Daneben bieten sich auch Formularelemente an (die man dann mit CSS entsprechend Designed) oder eben Layer (was aber wackelig im NC 4.x werden kann, sol heißen du provozierst damit Abstürze).
Struppi.
Hallo,
am einfachsten ist, Du arbeitest nicht mit Image-Wechsel sondern mit Layerwechsel.
z.B. <DIV id="Bild1"><span><img src="Bild1.JPG"></span><span>Bildbeschreibung></span></DIV>
das Vorladen geht dann auch anders:
<img src="Bild1.jpg" with="1px" height="1px">
Unter selffhtml gibt es auch ein Beispiel dazu. Mit CSS ist das auch möglich, aber gewagt und nur was für die Zukunft.
[LINK:http://selfaktuell.teamone.de/tippstricks/css/infobox/index.htm ]
willst Du den bisherigen Bilderwechsel beibehalten, kannst Du den Text wie folgt einblendem:
onclick='wechsleBild("Bild1");zeigeText("Text11",benutzt);benutzt="Text1"'
Function zeigeText(myId,entferne){
if(document.layers&&!document.all&&!document.getElementById)
{mtmp=eval("document."entferne+".visibility="show");
mtmp=eval("document."+myId+".visibility="hide");}
else if (docuemnt.all&&!document.getElementById)
{document.all[myId].style.visibility="inherit";
document.all[entferne].style.visibility="hidden";}
else
{document.getElementById(myId).style.display="inherit";
document.getElementById(entferne).style.display="none";}
}
Das ist nur eine ungetestete Demoversion, aber das Prinzip dürfte wohl klar sein.
Ich habe noch viele Beispiele von mir programmiert auf Lager. mail me ;-)
Danke vielmal ;-)
Michael
Och bitte,
onclick='wechsleBild("Bild1");zeigeText("Text11",benutzt);benutzt="Text1"'
Function zeigeText(myId,entferne){
syntax Error!
Es heißt function
if(document.layers&&!document.all&&!document.getElementById)
Das ist vielleicht richitg, aber wenn du document.layers hast hast du nie nicht document.all, es reicht also if(document.layers)
{mtmp=eval("document."entferne+".visibility="show");
mtmp=eval("document."+myId+".visibility="hide");}
und das dürfte eigentlich nicht funktionieren, du suchst document.layers[...]
else if (docuemnt.all&&!document.getElementById)
Logisch ist es zuerst auf getElementById zu prüfen
{document.all[myId].style.visibility="inherit";
document.all[entferne].style.visibility="hidden";}
else
{document.getElementById(myId).style.display="inherit";
}
Wieso denn display, das hat hier gar nichts zu suchen.
Also nochmal richtig (ungetestet):
function zeigeText(myId, entferne)
{
var show = null;
var hide = null;
var on = document.layers ? 'show' : 'visible';
if(document.getElementById)
{
show = document.getElementById(myId).style;
hide = document.getElementById(entferne).style;
}
else if(document.layers)
{
show = document.layers[myId]
hide = document.layer[entferne];
}
else if(document.all)
{
show = document.all[myId].style;
hide = document.all[entferne].style;
}
if(show) show['visibility'] = on;
if(hide) hide['visibility'] = 'hidden';
}
Ich habe noch viele Beispiele von mir programmiert auf Lager. mail me ;-)
Hoffentlich nicht alle so wie dieses.
Struppi.
Hallo Michael
Vielen Dank für die Tips und den Program Code. Werde versuchen, damit meine Dia-Show zu erweitern. Mal sehen ob's, klappt.
Gruss Marco
schau dir meinen Thread an!
Hatte genau das selbe problem:
http://forum.de.selfhtml.org/?t=32072&m=173518
HAb n guten tip bekommen:Zeuberwort innerHTML
Du kannst zb einer Zelle oder sonstwas eine Id /name geben und diese dann mittels
document.all.NAME.innerHTML =..
ansprechen, bei mir klappt das subba
Sii Juu
schau dir meinen Thread an!
Hatte genau das selbe problem:http://forum.de.selfhtml.org/?t=32072&m=173518
HAb n guten tip bekommen:Zeuberwort innerHTML
Du kannst zb einer Zelle oder sonstwas eine Id /name geben und diese dann mittelsdocument.all.NAME.innerHTML =..
ansprechen, bei mir klappt das subba
aber nur bei dir.
Nö Spaß beiseite, es klappt nicht in allen Browsern.
document.all ist IE 4 syntax, aber das steht sicher auch in selfHTML
Netscape kann den Inhalt von Layern nur per open(); write(); close() ändern (und das unzuverlässig) und Opera bisher gar nicht.
Struppi.