Autor | Zpráva | ||
---|---|---|---|
Kos112567 Profil |
#1 · Zasláno: 29. 1. 2017, 16:28:37
Ahoj,
rád bych měl na své stránce možnost přepnutí si vzhledu (nějaké tlačítko, které mi např. změní barvy). Nevíte někdo o nějakém dobrém návodu, popř. o radu jak to udělat? :) |
||
Lonanek Profil |
#2 · Zasláno: 29. 1. 2017, 16:53:33
|
||
Kos112567 Profil |
Ano, tento návod jsem také našel ale bohužel mi to nefunguje.
Mám tedy tento js function changeCss(styleUrl) { document.getElementById("css").href = styleUrl; } Další odkaz na css sobor v indexu a na ten javascript <link rel=stylesheet href="style_blue.css" id=css> <script src="js/change_color.js"></script> A ještě tlačítko <button onclick='changeCss("style_blue.css")'>Červená</button> Pokud ale přijdu na stránku, automaticky se mi tvoří vzhled na základě nově přidaného css (tedy aniž bych přepnul ten vzhled tlačítkem) PS V tom css souboru mám zatím jenom toto k vyzkoušení h1 { color: red } |
||
Tomáš123 Profil |
#4 · Zasláno: 29. 1. 2017, 22:05:03
Kos112567:
Ak sa jedná iba o jednoduchú zmenu farby, riešil by som to v čistom HTML a CSS pomocou input ov a pseudotriedy :checked .
V prípade potreby rozsiahlejších úprav môže dátová objemnosť súboru narásť. Z hľadiska optimalizácie by sa oplatilo farby, ktoré sa majú meniť definovať na jednom mieste: #red:checked ~ .header, #red:checked ~ .aside, #red:checked ~ ... { background-color: red; } #red:checked ~ .header h1, #red:checked ~ .header a, #red:checked ~ ... { color: red; } Podrobnejšia diskusia o princípe funkčnosti. |
||
Kos112567 Profil |
#5 · Zasláno: 30. 1. 2017, 16:51:52
Já bych rád, aby ta změna byla pro uživatele trvalá, tj. aby se to nepřepnulo zpět do výchozího nastavení po znovu načtení stránky
|
||
rafej Profil |
#6 · Zasláno: 30. 1. 2017, 17:20:25
Kos112567:
Přečti si pořádně to, co ti bylo doporučeno v 2. přízpěvku. Odkazovaný návod na konci zmiňuje, že je potřeba změnu vzhledu také uložit - např. do cookies, profilu uživatele nebo localStorage. Pokud máš jen jednoduchou HTML stránku (bez PHP, ASP, ...), tak bych asi zvolila uložení do cookies nebo localStorage pomocí javascriptu. |
||
Kos112567 Profil |
#7 · Zasláno: 30. 1. 2017, 19:53:07
Už mi to funguje :) Děkuji za rady
|
||
Časová prodleva: 7 let
|
0