nicht angemeldet
Galerie mit javascript
Kai345
Gunnar BittersmannIst es alleine mit javascript möglich folgendes Problem zu lösen:
Ich habe eine Galary Seite auf der ich 4 Bilder anzeige, bei einem klick auf den Link next sollen die nächsten 4 angezeigt werden.
Ich will also eine Galerie mit Java Script und ohne php/asp implementieren.
Ist das überhaupt möglich?
Meine bisherigen Versuche:
<html>
<head title = "Galerie"></head>
<body>
<table>
<tr>
<td><a href="jpg\nr"<script type="text/javascript">6</script>".jpg"><img src="jpg\nr1.jpg" width="150" height="100" border="0" </a>
<td><a href="jpg\nr2.jpg"><img src="jpg\nr2.jpg" width="150" height="100" border="0" </a>
</tr>
<tr>
<td><a href="jpg\nr3.jpg"><img src="jpg\nr3.jpg" width="150" height="100" border="0" </a>
<td><a href="jpg\nr4.jpg"><img src="jpg\nr4.jpg" width="150" height="100" border="0" </a>
</tr>
</table>
</body>
</html>
Man beachte meinen zum scheitern verurteilten Versuch javascript so einzusetzen wie ich es von asp gewöhnt bin :/
-
Hallo Merius!
Ist es alleine mit javascript möglich folgendes Problem zu lösen:
Ich habe eine Galary Seite auf der ich 4 Bilder anzeige, bei einem klick auf den Link next sollen die nächsten 4 angezeigt werden.In Deinem Beispiel ist aber kein Link »next«...
bei einem klick auf den Link next sollen die nächsten 4 angezeigt werden.
Meinst Du: »Bei einem Klick auf einem Link oder Button namens ›next‹ soll das jeweils nächste Bild angezeigt werden«?. Wenn ja, schau mal hier - den Filmstreifen brauchst Du in dem Fall nicht.
<script type="text/javascript">6</script>
^ ?
Ist das die Fortsetzung von >HTML< mit JavaScript? ;)
<head title = "Galerie"></head>
^^^^^
So erreichst Du keineswegs die Anzeige eines Browserfenster-Titels. Ferner: Deine <td> sind nicht geschlossen (</td> fehlt).
Man beachte meinen zum scheitern verurteilten Versuch javascript so einzusetzen wie ich es von asp gewöhnt bin :/
Der Versuch scheitert schon am HTML, sorry.
Viele Grüße aus Frankfurt/Main,
Patrick--
_ - jenseits vom delirium - _
[link:hatehtehpehdoppelpunktslashslashwehwehwehpunktatomicminuseggspunktcomslash]
Nichts ist unmöglich? Doch!
Heute schon gegökt?-
Grütze .. äh ... Grüße!
<script type="text/javascript">6</script>
^ ?Dynamischer Cyber-6 ;)
Der Versuch scheitert schon am HTML, sorry.
Außerdem benutzt Merius noch backslash statt slash für die Dateinamen.
Cü
Kai--
Der vertuschte Gefahrstoff: Dihydrogenmonoxid
What is the difference between Scientology and Microsoft? One is an
evil cult bent on world domination and the other was begun by L. Ron
Hubbard.
ie:{ fl:( br:< va:) ls:? fo:| rl:? n4:° ss:{ de:] js:| ch:? mo:| zu:| -
Hello out there!
Ferner: Deine <td> sind nicht geschlossen (</td> fehlt).
Doch, die 'td'-Elemente sind geschlossen; das End-Tag ist optional:
<!ELEMENT (TH|TD) - O (%flow;)* -- table header cell, table data cell--> [HTML401 §11.2.6]
▲Weglassen _sollte_ man es dennoch nicht.
See ya up the road,
Gunnar--
„Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)
-
-
Hallo,
Anscheinend mangelt es an einem Grundverständnis von JavaScript... JavaScript ist kein HTML-Präprozessor, ein JavaScript-Interpreter generiert keinen HTML-Quellcode. JavaScript kann das zwar bis zu einem gewissen Punkt, aber das ist die Ausnahme statt die Regel.
JavaScript tritt bestenfalls von »außen« an ein bestehendes HTML-Dokument heran, während es im Browser angezeigt wird. Da solltest dich gleich an »Unobtrusive JavaScript« gewöhnen, das heißt, dass die Seite auch ohne JavaScript vollständig funktioniert.
Man startet erst einmal mit einer HTML-Struktur, bei der möglichst alle Inhalte zugänglich sind. Bei einer Galerie hat man i.d.R. eine Liste mit Bildern.
<ol>
<li><img ....></li>
...
</ol>JavaScript schaltet sich dann beim Laden des Dokuments hinzu und modifiziert das HTML gegebenenfalls. Das Script sorgt dann dafür, dass erstmal vier Bilder zu sehen sind und fügt Navigationslinks ein.
Die grafische Anordnung übernimmt dabei, wie es auch sonst immer sein sollte, CSS. Das heißt, Layouttabellen usw. sind ungeeignet, weil JavaScript dann nicht einfach mit CSS alles umgestalten kann.
Gut, nochmal rekapitulieren:
1. Eine einfache Liste mit allen Bildern.
2. Ein Script, dass sich automatisch beim Laden der Seite startet. (onload ist nicht ganz so super, weil dann auf die Bilder gewartet wird, bevor das Script startet. Da gibts bessere Lösungen, die allerdings komplizierter sind.)
3. Es blendet erstmal alle Bilder (li-Elemente) außer die ersten vier aus.
4. Es fügt Zurück- und Vorwärts-Links ins Dokument ein, bei deren Aktivierung Funktionen aufgerufen werden, die die gegenwärtigen vier li-Elemente verstecken und die vier nächsten bzw. vorigen zeigen.Die Umsetzung mag für dich momentan vielleicht unmöglich sein. Es gibt sicher viele einfachere Lösungen, die HTML und JavaScript nicht trennen und insofern auch nicht »unobtrusive« sind. Aber wenn du etwas mehr mit JavaScript vorhast, solltest du dich langsam an diesen Stil gewöhnen, den ich hier beispielhaft im Konzept geschildert habe.
Mathias