Autor Zpráva
Jack3389
Profil *
Dobrý večer,

rád bych se zeptal jak pomocí javascriptu lze nastavit změnu pozadí elementu <li> ? Mám menu které po kliknutí vysune podnabídku a potřeboval bych, aby element <li> který toto vyvolá změnil po rozkliknutí barvu.

Mohl by mi někdo poradit jak na to? Mé pokusy byly neůspěšné.

Díky J.
pcmanik
Profil
Jack3389:
Najjednoduchšie je mu zmeniť, alebo priradiť ďalšiu css triedu, to urobíš pomocou element.className = 'nazov_triedy'; resp. element.className += ' nazov_triedy';

Priraďovať štýly samotným javascriptom nieje dobrý nápad, z hľadiska údržby. Čo ak si zmyslíš, že chceš zmeniť ešte farbu? Budeš musieť dopísať ďalší riadok. Takto len upravíš css a neriskuješ, že si zavedieš novú chybu do kódu.

Ak chceš lepšie poradiť, hoď nám odkaz na živú ukážku.
suvel
Profil
po onclick: document.getElementById("neco").style.backgroundColor = "#f00";


Doplňuji: buď přímo v html onclick='document.getElementById("neco").style.backgroundColor = "#f00"' nebo zavolat jako fci.
Jack3389
Profil *
suvel:
No tímto způsobem jsem to již zkoušel prvně, ale bohužel se mi ani nyní nedaří nastavit tu barvu pozadí ( mám prvotně definovaný obrázek na pozadí <li> - nejsem si jist jestli to něčemu vadí, každopádně se barva nezmění.)
suvel
Profil
Tak to už by opravdu chtělo živou ukázku. Jinak nejjednodušší je (a funguje):
<li onclick='this.style.backgroundColor="#f00"' style="width:100px">
Už mi to dnes nějak nemyslí :-)
Jack3389
Profil *
[#5] suvel
Tak jsem to teď zkoušel...když z css stylu vyhodím background-image: url(".."); tak se ta změna prodeve krásně, ale jakmile to zpět definuji tak vubec ne...dá se to nějak obejít? Např. místo barvy obrázek?
margin
Profil *
Jack3389:
Je rozdíl, jestli zkoušíš nastavit background (sdružená vlastnost, nedeklarované hodnoty pro pozadí nastaví na výchozí hodnoty), nebo backgroundColor (nastaví barvu pozadí, ostatní hodnoty pozadí se nemění). Pokud se to člověk pochopí a naučí se sdruženými CSS vlastnostmi pracovat, dá se tím ušetřit a zpřehlednit kód.

Pokud chceš použít postup, který radí Jack3389, tak máš dvě možnosti:
Odstranit obrázek na pozadí a nastavit barvu pozadí:
<li onclick='this.style.backgroundImage="none",this.style.backgroundColor="red"'>

Nebo nastavit pozadí (využitím sdružené CSS vlastnosti) na požadovanou barvu:
<li onclick='this.style.background="red"'>

Každopádně doporučuji postup, který navrhuje [#2] pcmanik, ale i tam je třeba rozlišovat, kdy použít "obyčejnou" CSS vlastnost a kdy použít sdruženou CSS vlastnost.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: