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:
<div style="background-image:url(kep_1.png);" onMouseOver="this.style.backgroundImage='url(kep_2.png)'" onMouseOut="this.style.backgroundImage='url(kep_1.png)'">
</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:
function csere ()
{
document.getElementById("index").style.backgroundImage="url(pictures/others/mo2.png);"
}
A linkhez ezt írtam:
<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:
<script language="JavaScript">
  function csere(melyik,kepnev) {
    if (melyik==1) {
    document.getElementById('kep').style.background="url("+kepnev+")";
    }
    else if (melyik==2) {
    document.getElementById('kep').style.background="url("+kepnev+")";
    }
  }
</script>
Ha a <div>-be ez van írva pl.:
<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:

function csere ()
{
document.getElementById("index").style.backgroundImage="url(pictures/others/mo2.png)"
}
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.