Bildertausch per JS?
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
angeben
anzeigen
ausschneiden
austausch
background
bild
bildwechsel
entscheidene fehler
formen
hintergrund
image
information
login
pfad
quelltext
roman
stehen
stil
username
wahrscheinlich hast
-
So...
ich habe folgendes problem:
ich habe ein login feld (2 felder, das eine ist das username feld das andere das password feld)... diese felder haben ein hintergrund bild...
sobald text eingegeben wird bzw text drin steht soll der hintergrund ge?ndert werden, von bild1.jpg auf bild1focus.jpg sagen wir jetzt mal einfach...
das er beim focus das ?ndert ist ja einfach (css), aber das es danach noch auf dem focus bild bleibt ist mir ein r?tsel...
so, freue mich auf ne l?sung...
gru -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Gib mal den Source, wahrscheinlich hast du dich nur vertippt.
Verwendest du eine reine CSS L?sung, oder nimmst du auch JavaScript dazu ? (Man kann mit CSS schlie?lich nicht ?berpr?fen, ob ein Eingabefeld leer ist) -
der css stil:
.login_name { width: 100px; height: 17px; background: url('../images/_-45.jpg'); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_name:focus { width: 100px; height: 17px; background: url('../images/_-45focus.jpg'); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_pass { width: 100px; height: 17px; background: url('../images/_-47.jpg'); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_pass:focus { width: 100px; height: 17px; background: url('../images/_-47focus.jpg'); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; }
die felder:
<input type='text' name='username' class='login_name'>
UND
<input type='password' name='password' class='login_pass'>
so... wirste daraus schlau? :D
gru?
samael -
Erstmal hei?t es background-image:url()
Und nicht nur background
Die Angaben in url() sollten ohne Anf?hrungszeichen stehen.
Das war aber nicht der entscheidene Fehler.
Den habe ich nicht gefunden, aber nachdem ich lange genug rumprobiert habe, ging es.
<style type="text/css">/* <![CDATA[ */ .login_name { width: 100px; height: 17px; background-image: url(../home/tygatur/DDDGH/DDDGH1st.gif); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_name:focus { width: 100px; height: 17px; background-image: url(../home/tygatur/DDDGH/OSOR.jpg); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_pass { width: 100px; height: 17px; background-image: url(../home/tygatur/DDDGH/DDDGH1st.gif); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } .login_pass:focus { width: 100px; height: 17px; background-image: url(../home/tygatur/DDDGH/OSOR.jpg); font-family: "Times New Roman",Times,serif; font-size: 12px; border: 0px; } /* ]]> */</style> -
Erstmal hei?t es background-image:url()
Und nicht nur background
Die Angaben in url() sollten ohne Anf?hrungszeichen stehen.
also, man kann sowohl background als auch background-image schreiben, denn man kann unter background auch noch weiter informationen angeben, zB x|y-repeat etc... und background-image kann man nur das bild angeben. und wenn ich die angaben in url ohne anf?hrungszeichen setze kann er mir das bild nicht anzeigen...
Das war aber nicht der entscheidene Fehler.
Den habe ich nicht gefunden, aber nachdem ich lange genug rumprobiert habe, ging es.
das was ich gepostet habe waren nur ausz?ge von einem LANGEN quelltext, habe nur die entscheidenden stellen gepostet... und das was du angegeben hast ist genau das was ich bei mir drin habe, nur in gek?rzter form wegen dem ausschnitt...
also, keine wirkliche l?sung ^^
gru?
samael
ps: es muss mit js sein, weil man doch nur mit js pr?fen kann ob in einem feld was steht, oder? -
bei mir hat es aber gefunzt, so wie du es haben wolltest (Bildwechsel eben). Probier mal meinen Code aus.
Ja, ohne JS geht das net.
Hier der Code f?r 1 <input>
<input type='text' name='username' class='login_name' onkeyup="if(this.value.length>0)this.style.backgroundImage='url(../home/tygatur/DDDGH/OSOR.jpg)';else this.style.backgroundImage='url(../home/tygatur/DDDGH/DDDGH1st.gif)';">
Einfach die Pfade austauschen und das m?sste funzen. -
mein css teil hat auch funktioniert, dein js teste ich jetzt mal....
-
da haben wir noch ein kleines problem...
wenn die seite geladen wird wird gar kein bild angezeigt... wie ?nder ich das?!?
gru?
samael -
samael schrieb:
da haben wir noch ein kleines problem...
wenn die seite geladen wird wird gar kein bild angezeigt... wie ?nder ich das?!?
gru?
samael
Du musst nat?rlich erstmal das Standard-Bild mit CSS festlegen. -
danke
kann geschlossen werden -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
