nicht angemeldet
Rollover Effekt mit Bildern
Ich habe ein Javascript geschrieben welchen über die .src Eigenschaft von Bildern das Bild tauscht wenn man mit der Maus auf das Bild geht (onMouseover). Wie kann ich verhindern dass der Browser das Bild immer wieder neu herunterlädt wenn man die Maus über ein Bild bewegt.
-
Auch Dir ein besonders fröhliches Hallo,
Wie kann ich verhindern dass der Browser das Bild immer wieder neu herunterlädt wenn man die Maus über ein Bild bewegt.
war das eine Frage.
Der Browser lädt die Grafik neu, wenn er sie nicht im Cache hat - ganz einfach. Entweder sind Deine lokalen Einstellungen falsch, oder die Grafiken werden vom Server als nicht zu cachen geliefert.
Cheatah
-
Noch eine Frage zu "Rollover"
Folgende Aufgabenstellung: Zwei Frames, links das Menü
(GIF-Dateien). Wenn man mit der Maus über ein Bild fährt, wird es heller (mit "onmouseover" und "onmouseout").
Das geht ja noch recht einfach.So, und jetzt kommts: Wenn man ein Bild anklickt, soll im rechten Frame ein anderer Inhalt erscheinen (logisch!). Aber im Menü soll das Bild dann "hell" bleiben. Das heißt der angewählte Menüpunkt soll immer hervorgehoben werden, und wenn man mit der Maus über einen Menüpunkt fährt, soll er auch hervorgehoben werden.
Ich schaff zwar das eine oder das andere, aber nicht beides gemeinsam. Dazu kommt noch, daß es Untermenüs gibt usw., aber das ist nicht das Problem.
Momentan kenn ich nur die Lösung, daß ich für alle Möglichkeiten ein neues Menü, d.h. eine neue HTM-Datei lade. Aber ich denk mir, das müßte doch einfacher gehen. Mit einer HTM-Datei.
Vielleicht kann mir jemand helfen! Danke! Peter
-
Hi,
Aber im Menü soll das Bild dann "hell" bleiben.
das JavaScript, welches für die Bildänderung verantwortlich ist, soll sich also merken, welcher Punkt gerade angewählt wurde, und entsprechend reagieren. Das geht mit Hilfe von Variablen und 'if'.
Momentan kenn ich nur die Lösung, daß ich für alle Möglichkeiten ein neues Menü, d.h. eine neue HTM-Datei lade.
Diese Lösung ist zu bevorzugen, weil die andere von JavaScript abhängig ist. In diesem Fall kannst Du vermutlich sogar auf Frames ganz verzichten und das Menü in die entsprechende Seite einbringen, was weitere Vorteile besonders für den User bietet.
Cheatah
-
hallo,
So, und jetzt kommts: Wenn man ein Bild anklickt, soll im rechten Frame ein anderer Inhalt erscheinen (logisch!). Aber im Menü soll das Bild dann "hell" bleiben. Das heißt der angewählte Menüpunkt soll immer hervorgehoben werden, und wenn man mit der Maus über einen Menüpunkt fährt, soll er auch hervorgehoben werden.
zu beiden im thread behandelten themen würde ich mir mal den code bei tuev-nord.de (frameset, menü oben) anschauen. dort habe ich beides mal vor urzeiten gemacht. ansonsten: framesets nerven total. aber das nur als kleine bemerkung am rande.
gruß: kaspar
-
-
-
Hallo,
im Gegensatz zu Cheatah (zu schnell geschossen?) habe ich Dein Vorgehen so verstanden, daß du das Bild austauschst, ohne es vorgeladen zu haben. Das passiert zum Bsp auch dann, wenn man die Austauschroutiene direkt in den a-Tag einbaut, so wie es idiotischerweise PaintshopPro macht.
Das Geheimnis ist, die Bilder beim laden der Seite vor zu laden. dadurch stehen die im Cache und sind beim auslösen des mouseover-Effektes sofort da. Ich selber benutze immer folgende Standart-Routine. (Achtung, funktioniert so nicht bei Bildern innerhalb von Divs mit dem NS, da muß die Routiene noch erweitert werden....)
Oben im Head:
<SCRIPT LANGUAGE="JavaScript">
<!--
aus_eins = new Image();
aus_eins.src = "schalter_aus.gif";
an_eins = new Image();
an_eins.src = "schalter_an.gif";function Bildwechsel(Bildname,Bildobjekt)
{
window.document.images[Bildname].src = Bildobjekt.src;
}//-->
</script>und die dazugehörende a-Tag-Zeile:
<A HREF="naechste_seite.html"
onMouseOver="Bildwechsel('schalterbild_eins',an_eins)"
onMouseOut="Bildwechsel('schalterbild_eins',an_aus)">
<img name="schalter_eins" src="schalter_an.gif" width="34" height="34" border="0" alt=""></a>Wenn Du (sehr wahrscheinlich ;-) ) mehr mouseoverflächen hast, dann must Du eben die jeweiligen "Bildersets" (bestehend aus den beiden Bildern) wie oben geschrieben dazu vorladen. Also meinentwegen:
aus_zwei = new Image();
aus_zwei.src = "schalter_zwei_aus.gif";
an_zwei = new Image();
an_zwei.src = "schalter_zwei_an.gif";etc..... einfach am Anfang untereinander weg schreiben....
Es ist im Prinzip die Routine, die auch in SELFHTML steht, nur daß hier das image-Tag einen namen bekommt (wichtig) und dieser name der Austauschroutiene übergeben wird.
Chräcker