ugrás a tartalomhoz

DIV hátterének cseréje javascripttel

Anonymous · 2005. Szep. 7. (Sze), 13.18
Van egy DIV elemem, ennek van egy háttere (kép). Azt szeretném elérni, hogy link fölé vive az egeret a kép változzon (onMouseOver hatására).
Tudom hogy a DOM segitségével kell valahogy megoldani, (getElementById és társai) de nem jöttem rá hogy hogyan. Sajnos magyar nyelven sz*rt se találtam erről, az angolhoz meg kevés vagyok. Aki tud segíteni, vagy magyar nyelvű forrást, esetleg könycímet adni annak nagyon megköszönöm...
‹ url titkosítása kisebb nagyobb nyíl kódból ›
 ■
1

működő megoldás

Anonymous · 2005. Szep. 7. (Sze), 18.24
Talán próbáld meg ezt:
  1. <div style="background-image:url(kep_1.png);" onMouseOver="this.style.backgroundImage='url(kep_2.png)'" onMouseOut="this.style.backgroundImage='url(kep_1.png)'">  
  2. </div>  
Ez alapján aztán készíthetsz egy függvényt is és rövidebb lesz a kódod. Meg szebb. :-))
2

diszkrét js

Hojtsy Gábor · 2005. Szep. 7. (Sze), 20.05
A fentiből kiindulva érdemes a diszkrét JavaScript megvalósítást előnyben részesíteni. A this-t olyankor valóban a getElementById tudja helyettesíteni.
3

érvénytelen argumentum

Anonymous · 2005. Szep. 8. (Cs), 11.59
Ezt a függvényt kreáltam:
  1. function csere ()  
  2. {  
  3. document.getElementById("index").style.backgroundImage="url(pictures/others/mo2.png);"  
  4. }  
A linkhez ezt írtam:
  1. <a class="hor" id="spec"  href="/english/specials/specials.html" onMouseOver="csere (); return true">  
Ha a link fölé viszem az egeret azt írja ki hogy érvénytelen argumentum....

Hol a hiba? Persze azon kívül hogy nem értek hozzá :))
8

az oldalon bárhol felhasználhatod így

Anonymous · 2005. Szep. 10. (Szo), 21.28
Az oldalon bárhol felhasználhatod így, csak a képek nevét kell változtatnod:
  1. <script language="JavaScript">  
  2.   function csere(melyik,kepnev) {  
  3.     if (melyik==1) {  
  4.     document.getElementById('kep').style.background="url("+kepnev+")";  
  5.     }  
  6.     else if (melyik==2) {  
  7.     document.getElementById('kep').style.background="url("+kepnev+")";  
  8.     }  
  9.   }  
  10. </script>  
Ha a <div>-be ez van írva pl.:
  1. <div id="kep" style="width:40;height:40;background-image:url(kep_2.gif);cursor:hand;" onMouseOver="csere(1,'kep_1.gif')" onMouseOut="csere(2,'kep_2.gif')">  
4

Elgépelés

Anonymous · 2005. Szep. 8. (Cs), 22.13
Húúúúúúúúú megoldódott!

Az a k***a pontosvessző nem kell a végére.
Így helyes:
  1. function csere ()  
  2. {  
  3. document.getElementById("index").style.backgroundImage="url(pictures/others/mo2.png)"  
  4. }  
Köszi a segítséget mindenkinek!
5

csak nem oda

Jano · 2005. Szep. 8. (Cs), 23.39
Kelleni kell, csak nem oda, hanem az idezojel után.
6

most működik

Anonymous · 2005. Szep. 9. (P), 11.03
Nem tudom, most működik.
Ha nem teszem oda milyxen hibát okozhat?
7

Ha utána írsz valamit

Jano · 2005. Szep. 9. (P), 16.17
Esetleg ha később utána írsz valamit akkor előfordulhat, hogy a parser rosszul értelmezi a parancs, utasítés végét. JavaScript nem annyira háklis erre de jobb megszokni ezt a programozónak.