| Autor | Zpráva | ||
|---|---|---|---|
| Jack3389 Profil * |
#1 · Zasláno: 21. 3. 2013, 22:35:37
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 |
#3 · Zasláno: 21. 3. 2013, 22:39:06 · Upravil/a: suvel
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 * |
#4 · Zasláno: 21. 3. 2013, 23:00:30
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 |
#5 · Zasláno: 21. 3. 2013, 23:11:19
Tak to už by opravdu chtělo živou ukázku. Jinak nejjednodušší je (a funguje):
<li onclick='this.style.backgroundColor="#f00"' style="width:100px"> |
||
| Jack3389 Profil * |
#6 · Zasláno: 21. 3. 2013, 23:18:58
[#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 * |
#7 · Zasláno: 21. 3. 2013, 23:30:15
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. |
||
|
Časová prodleva: 11 let
|
|||
0