Hyperlink (Zeichen=Pfeil) nach Klick austauschen
1 1 
molily
Hyperlink (Zeichen=Pfeil) nach Klick austauschen
Gunnar BittersmannHi Zusammen,
ich hab ein JS Toogle gebaut, damit fährt bei einem Klick auf den Link "Einfahren" die DIV nach oben zu und beim Link "Ausfahren" wieder nach unten.
Jetzt möchte ich die beiden Links gegen 2 Zeichen austauschen nämlich mit 2 Pfeilen. Die Grundstellung sollte ein Pfeil sein der nach Rechts zeigt, also geschlossener Zustand, beim Klick (onclick) soll dieses Zeichen und gleichzeitig der Link ausgetauscht werden mit dem Pfeil der nach unten zeigt.
Es sollte immer der aktuelle Zustandt mit dem Pfeil dargestellt werden (offen oder geschlosse)
Könnte mir jemand sagen wie ich das in diesem Fall genau anstelle?
Viele Dank
ml
-
Hi,
Es sollte immer der aktuelle Zustandt mit dem Pfeil dargestellt werden (offen oder geschlosse)
Könnte mir jemand sagen wie ich das in diesem Fall genau anstelle?
Wenn du es selbst geschafft hast, ein "Toggle"-Script zu schreiben - dann weiss ich nicht, wo dein Problem liegt, synchron dazu auch noch bspw. den Inhalt eines klitzekleinen Textknotens anzupassen.
MfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“-
Währe nett wenn mir einfach jemand sagen könnte wie man es genau anstellt ohne mich zu belehren was ich kennen sollte.
Danke
-
Hi,
Währe nett wenn mir einfach jemand sagen könnte wie man es genau anstellt ohne mich zu belehren was ich kennen sollte.
Ich wollte dich nicht belehren, wundere mich aber, was daran dir Probleme bereitet.
Also teile uns bitte mit, was du bereits versucht hast, und woran genau du scheiterst.
MfG ChrisB
--
„This is the author's opinion, not necessarily that of Starbucks.“ -
@@mlClient:
Währe nett wenn mir einfach jemand sagen könnte wie man es genau anstellt ohne mich zu belehren was ich kennen sollte.
Tröste dich, auch ChrisB bekommt den den Titel "Berater" aberkannt.
Live long and prosper,
GunnarPS: Den Konjunktiv von „sein“ sollte man vielleicht doch kennen. (Der wäre nicht „währe“, auch wenn der Irrtum lange währt.)
PPS. Und das Zeichen ',' auch.
--
Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
-
-
@@ChrisB:
Wenn du es selbst geschafft hast, ein "Toggle"-Script zu schreiben - dann weiss ich nicht, wo dein Problem liegt, synchron dazu auch noch bspw. den Inhalt eines klitzekleinen Textknotens anzupassen.
Oder ein klitzekleines Hintergrundbildchen zu ändern. Bzw. dessen Position, weil es ein CSS-Sprite ist.
Live long and prosper,
Gunnar--
Das einzige Mittel, den Irrtum zu vermeiden, ist die Unwissenheit. (Jean-Jacques Rousseau)
-
-
Jetzt möchte ich die beiden Links gegen 2 Zeichen austauschen nämlich mit 2 Pfeilen. Die Grundstellung sollte ein Pfeil sein der nach Rechts zeigt, also geschlossener Zustand, beim Klick (onclick) soll dieses Zeichen und gleichzeitig der Link ausgetauscht werden mit dem Pfeil der nach unten zeigt.
Es sollte immer der aktuelle Zustandt mit dem Pfeil dargestellt werden (offen oder geschlosse)Bilder kannst du im HTML als http://de.selfhtml.org/html/grafiken/einbinden.htm@title=img-Element oder im CSS als http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=background-image einbinden.
Per JavaScript kannst du nichts anderes machen, als diese eingebundenen Bilder ändern. Wie gesagt würde sich *eine* Hintergrundgrafik anbieten, die beide Status in sich vereint. Du musst dann nur die <http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_position@title=Position der Hintergrundgrafik> anpassen, sodass ein anderer Teil zu sehen ist, der dann eben den Pfeil nach unten enthält. Das nennt sich CSS Sprites.Diese Logik verlagerst du am besten ins CSS, sodass du im JavaScript nur eine Klasse setzen musst. Als Beispiel:
.toggle,
.toggle-highlight {
background-image: url(./img/toggle.png);
}.toggle {
background-position: left top;
}
.toggle-highlight {
background-position: left -20px;
}toggle.png enthält also beide Pfeile mit etwas Abstand, der zweite wird sichtbar, wenn die Grafik um 20px nach oben herausgeschoben wird (fiktiver Wert).
Im JavaScript wechselst du nun bloß http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#universaleigenschaften@title=className aus, indem du die Klasse beim Aufklappen auf toggle-highlight setzt und beim Zuklappen zurück auf toggle.
Mathias