Autor |
Nachricht |
Tachikoma
Threadersteller
Dabei seit: 20.01.2004
Ort: Nebenstadt Fulda
Alter: 45
Geschlecht:
|
Verfasst Mi 01.12.2004 14:49
Titel Next und Back Navigation ?? |
|
|
Ich, MG Printler der froh ist das er eine Website
mit Frames einigermaßen hinbekommt, suche eine
einfache (!!) Möglichkeit in einer eben solchen Seite
eine simple "NEXT&BACK"-Navigation hinzubekommen.
Es geht dabei um ein Bild das in einem separaten
Frame auf einer separaten html-Seite ist.
Ich möchte das nun eben dieses eine Bild beim Maus-
klick auf NEXT (das NEXT ist unter dem Bild-Frame,
also nicht im selben!) zu einem anderen Bild wechselt.
... und wieder zu einem anderen bei
Aber wie?
Zuletzt bearbeitet von Tachikoma am Mi 01.12.2004 20:06, insgesamt 1-mal bearbeitet
|
|
|
|
|
utor
Dabei seit: 06.02.2003
Ort: bln
Alter: 41
Geschlecht:
|
Verfasst Mi 01.12.2004 14:58
Titel
|
|
|
erstens keine eye-catcher titel bitte.
soweit ich weiss kannste entweder halt zig einzelseiten basteln
und die dann per hand einfach miteinander verlinken, oder
du lässt das generieren, das ist sicher die praktischere
lösung. zum beispiel so wie hier.
aber ich bin auch nurn printler...
utor
|
|
|
|
|
Anzeige
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Mi 01.12.2004 15:39
Titel
|
|
|
Mhhhh...
sind Anzahl und Name der Bilder fix und variabel?
wenn die fix sind, kannst die Daten innen Array speichern und dann an den andern Frame weitergeben, und der Zeigt das dann an etc.
Oder du nennst die Bilder 1.jpg, 2.jpg, 3.jpg etc
und sagst, dass der bei nem Klick auf next den aktuellen Bildpfad ändern soll in _aktuelleVariable_+1 oder so und dann musst halt jedesmal fragen, "wenn das neue ergebnis größer, als totale Anzahl Bilder ist, mach nix und den next-button weg" etc...
Falls die Variabel sind, musst das Datenbankgestützt machenm....
aber ne wirklich einfache Menthode für neulinge gibts net
|
|
|
|
|
Tachikoma
Threadersteller
Dabei seit: 20.01.2004
Ort: Nebenstadt Fulda
Alter: 45
Geschlecht:
|
Verfasst Mi 01.12.2004 20:05
Titel
|
|
|
Entschuldige... bin wohl aus Versehen auf dem Shift-Key gelandet!
So. Ferret... kannst du das nochmal für dumme Printler erklären?
Die Anzahl der Bilder ist fest!
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Do 02.12.2004 10:04
Titel
|
|
|
Na dann...
Mal überlegen, wie ich das kindgerecht formulieren kann...
in einem sogenannten Array kannst du einer Variable mehrere Werte zuweisen und auf die einzelnen zugreifen
SelfHTML - Array
Die Werte da drin sind einfach immer die Bildpfade und wen der auf NEXT klickt, soll der nix anderes machen, als das Bild neu zu laden... und zwar mit dem nächsten Wert, der in dem array dran kommt.
in nem Frameset kann das dann in etwa so ausschaun (hab das nur eben so zusamengetippt, also is noch nicht 100% fertig)
den Frame, in dem der Next und der Last-Button sind, kannst so aufbaun:
Code: | <center>
<a href="javascript:last()">LAST</a>
<img src="leer.gif" alt="" height="1" width="100">
<a href="javascript:next()">NEXT</a>
</center>
<form name="form" action=""><input type="hidden" name="cache" value="0"></form>
<script type="text/javascript">
Bildpfade = new Array("Bild1.gif","Bild2.gif","Bild3.gif","Bild4.gif");
function next() {
var neu = Math.abs(document.form.cache.value)+1;
document.form.cache.value=neu;
parent.main.document.getElementById('Bild').src=Bildpfade[neu];
}
function last() {
var neu = Math.abs(document.form.cache.value)-1;
document.form.cache.value=neu;
parent.main.document.getElementById('Bild').src=Bildpfade[neu];
}
</script> |
.. da fehlt jetz natürlich, dass der jedesmal schaunt, obs das letzte Bild is oder das erste.. dann soll er halt ide next und last-buttons ausblenen, aber das is ja kein prob, musst nur Bildpfade.length benutzen und die Bilder auf nen div mit id setzen und dann den style-attribut auf visible/hidden setzen und so, und mit if-bedingung dann halt prüfen, obs jetz das letzte bzw. erste is... das machst am besten selber; sollst ja auch was Spaß haben, will dir ja nicht die ganze Freude nehmen
das Frame, in dem die Bilder sein sollen, kann so ausschaun (muss im Frameset name="main" haben...
Code: | <center><img src="Bild1.gif" alt="" id="Bild"></center> |
.. sieht dann so aus...
also wie gesagt, fehlt noch das mit dem array-length-check und hidden machen etc, aber das is ja kein stress...
Zuletzt bearbeitet von fyll am Do 02.12.2004 10:09, insgesamt 2-mal bearbeitet
|
|
|
|
|
Tachikoma
Threadersteller
Dabei seit: 20.01.2004
Ort: Nebenstadt Fulda
Alter: 45
Geschlecht:
|
Verfasst Do 02.12.2004 10:30
Titel
|
|
|
Dankeschön!!!
Aber ich glaub ich muss jetz erstma studieren
gehen um das richtig zu verstehen.
Ich setz mich mal damit auseinander!
Sascha
|
|
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Do 02.12.2004 10:51
Titel
|
|
|
wil ich mal nicht so sein
guckst du
Code: |
<div style="position:absolute; top:30px; left:100px; visibility:hidden" id="zurueck"><a href="javascript:last()"><img src="zurueck.gif" alt="" border="0"></a></div>
<div style="position:absolute; top:30px; left:300px; visibility:visible" id="vor"><a href="javascript:next()"><img src="vor.gif" alt="" border="0"></a></div>
<form name="form" action=""><input type="hidden" name="cache" value="0"></form>
<script type="text/javascript">
Bildpfade = new Array("Bild1.gif","Bild2.gif","Bild3.gif","Bild4.gif");
function next() {
var neu = Math.abs(document.form.cache.value)+1;
if(neu==(Bildpfade.length-1)) {
document.getElementById('vor').style.visibility="hidden";
} else {
document.getElementById('vor').style.visibility="visible";
document.getElementById('zurueck').style.visibility="visible";
}
document.form.cache.value=neu;
parent.main.document.getElementById('Bild').src=Bildpfade[neu];
}
function last() {
var neu = Math.abs(document.form.cache.value)-1;
if(neu==0) {
document.getElementById('zurueck').style.visibility="hidden";
} else {
document.getElementById('zurueck').style.visibility="visible";
document.getElementById('vor').style.visibility="visible";
}
document.form.cache.value=neu;
parent.main.document.getElementById('Bild').src=Bildpfade[neu];
}
</script> |
KLICK
musst nur die Pfeile oder halt das ganze Layout deinem anpassen und hier:
Code: | Bildpfade = new Array("Bild1.gif","Bild2.gif","Bild3.gif","Bild4.gif"); |
deine Bilder eingeben... wieviele is egal, und wie sie heißen auch... solllten halt im selben Ordner liegen oder halt "bilder/Bildx.gif" oder so, wenn se im Ordner Bilder liegen....
Zuletzt bearbeitet von fyll am Do 02.12.2004 10:57, insgesamt 2-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
back to top pfeil...
Back to top mit slide Effekt
history back in php in echo
[JS] Browser Back Button per JS deaktivieren
Alternative zu history(back) falls JS deaktiviert ist?
Safari und javascript="history.back()"
|
|