| Autor | Zpráva | ||
|---|---|---|---|
| Suta Profil |
#1 · Zasláno: 22. 12. 2009, 18:47:43
Prosím o radu s vyřešením následující situace.
1. Hlavní styl (css) mám definován v externím souboru. Uvedu příklad: #hlavicka a { color: black; display: block; } // priklad z externiho souboru2. Jelikož můžu mít v prvku s id "hlavicka" více odkazů, bude tento styl logicky aplikován na všechny prvky <a> 3. Nyní budu chtít dynamicky změnit styl pro všechny tyto prvky. Dejme tomu, že budu chtít místo černé barvy barvu modrou. Řešení 1. Pomocí DOMu můžu jednoduše načíst všechny tyto elementy <a> a postupně jim pomocí atributu "style" přiřadit příslušné vlastnosti a hodnoty. Např.: <script>$("hlavicka").getElementsByTagName("a")[x].style.color = "blue";</script>Tento způsob má tu nevýhodu, že přidám-li náslědně do elementu s id "hlavicka" další prvek <a>, bude na něj aplikován původní pravidlo uvedené v externím souboru. Řešení 2. Jak tedy docílit přepsání původního pravidla z externího souboru a docílit tak toho, aby změněné pravidlo bylo aplikováno i na všechny následně dynamicky vytvořené elementy <a> v elementu s id "hlavicka"? Při následujícím pokusu: <script>
// v ramci zjednoduseni nacitam pouze první odkaz
var s = document.getElementsByTagName("style")[0];
funkcion prepisStyl(pripadne_parametry) {
s.innerHTML += "#hlavicka a { color: blue; dalsi_vlastnost: dalsi_hodnota; }";
}
</script>S tímto pokusem neuspěju v IE6 (nevím zda-li také v IE7 či jiných prohlížečích, netestoval jsem). Přidání obsahu do tagu <style> mi pak IE neumožní ani při použití textového uzlu zapsaného pomocí appendChild. Díky za všechny postřehy a rady. |
||
| Chamurappi Profil |
#2 · Zasláno: 22. 12. 2009, 19:05:43 · Upravil/a: Chamurappi
Reaguji na Sutu:
Obě řešení jsou docela ošklivá. Použij řešení 3: změň třídu některého z předků těch odkazů a uprav stylopis, aby je podle ní přebarvil. |
||
| Suta Profil |
#3 · Zasláno: 23. 12. 2009, 16:06:21
Reaguji na Chamurappiho:
Nerozumíme si. Je to pro to, že jsem nepopsal konkrétněji, čeho chci dosáhnout. Samozřejmě že můžu změnit třídu předka. Problém je v tom, že tuto třídu dopředu neznám. Styl je vytvářen dynamicky teprve po načtení stránky. Zkusím co nejpodrobněji: 1. Otevřeš webovou stránku, která je naprogramovaná jako editor pro (dejme tomu) určitou část webu (např. pro tvorbu navigace). 2. Dejme tomu že teď otevřeš základní menu a budeš chtít upravit jeho vzhled k obrazu svému. Pomocí navigačního panelu můžeš menu zvětšovat, zmenšovat, měnit barvu pozadí jednotlivých položek atd. JDE MI KONKRÉTNĚ O TOHLE STADIUM. 3. Pochopitelně mám editor vytvořen tak, že jednotlivé změny ukládá na pozadí do databáze a při načtení webové stránky s nově vytvořeným menu použije třídu, která je vytvořena na základě údajů z databáze. Já však řeším situaci "on-line", kdy potřebuji pouze pro ilustraci změnit vzhled daných prvků na stránce pro zobrazení budoucího vzhledu BEZ načtení stránky. Napsal jsem to srozumitelně? Proto moje otázka, jak zapsat nový styl (přepsat původní) přímo ve stránce. Pokud bych chtěl použít tvé řešení, které používá "novou třídu", musím tuto třídu také dynamicky vytvořit a zapsat do stránky, aby mohla být aplikována. A tady jsem zpět u problému s IE6 (či jinými prohlížeči?). Díky za další rady. |
||
| martin b. Profil * |
#4 · Zasláno: 23. 12. 2009, 16:16:22
viz Chamurappi
S tím, že na té stránce, kde to edituješ si vytvoříš element <style>, do něj napíšeš ty styly, které chceš (tedy nějakou tu třídu, třeba .greenLinks{color: green !important}) a pak předkovi těm odkazům dáš tuto třídu. |
||
| Suta Profil |
#5 · Zasláno: 23. 12. 2009, 16:19:24 · Upravil/a: Suta
Reaguji na martina b.:
„na té stránce, kde to edituješ si vytvoříš element <style>, do něj napíšeš ty styly, které chceš(...)“ A to je právě ono co píšu v úvodním příspěvku. IE6 mi při pokusu zapsat cokoliv do elementu <style> háže chybu. |
||
| martin b. Profil * |
#6 · Zasláno: 23. 12. 2009, 16:42:03
Suta:
To jsem nějak přehlédl a ani jsem to nečetl poprvé. Ale k tématu. A zkoušel jsi vytvořit zcela nový element <style>? |
||
| Suta Profil |
#7 · Zasláno: 23. 12. 2009, 17:25:47
Reaguji na martina b.:
Ano. IE6 bohužel nedovolí zapsat cokoliv do tagu <style>, a je jedno, zda-li je tento tag v "původním" kódu, nebo vytvořím a vložím do stránky dynamicky tag nový. |
||
| martin b. Profil * |
#8 · Zasláno: 23. 12. 2009, 17:33:07
|
||
| Suta Profil |
#9 · Zasláno: 24. 12. 2009, 11:38:30
Díky! Přesně to jsem hledal.
|
||
|
Časová prodleva: 14 let
|
|||
0