Смена стилей CSS с запоминанием на Cookie
Старый скрипт, переделанный Balbesskin'ым. Уверен, многим будет интересно. На полноценных cms, таких как Wordpress данная реализация не нонсенс.Суть скрипта в том, что при нажатии на определенную кнопку происходит смена стиля, ничего сверхъестественного.Установка по этапам, будьте внимательнее и у вас всё получиться! <link id="change" rel="StyleSheet" href="" /> <div class="themes"> .themes {position: fixed; top: 50px; right: 50px;}
Установка
1) Вставьте код в Верхнюю часть сайта:
2) Установите HTML-код, чуть ниже js-скрипта:
<script>
function changeCSS(url) {
if (!arguments.length) {
url = (url = document.cookie.match(/\bchange=([^;]*)/)) && url[1];
if (!url) return '';
}
document.getElementById('change').href = url;
var d = new Date();
d.setFullYear(d.getFullYear() + 1);
document.cookie = ['change=', url, ';expires=', d.toGMTString(), ';path=/;'].join('');
return url;
}
changeCSS();
</script>
3) Установка CSS-стилей:
<div class="red" onclick="changeCSS('/red.css')"></div>
<div class="green" onclick="changeCSS('/green.css')"></div>
</div>
Ну вот, собственно, и всё! Как видите, всё очень просто!
.themes div {border-radius: 3px; width: 25px; height: 25px; margin-left: 5px; float: left; cursor: pointer;}
.themes .red {background: #da3c3c;}
.themes .green {background: #3cda3c;}
Случайные материалы
Десятка дорогих сборных, попавших на ЕВРО-2016... | Интересные факты в цифрах... | Появлению каждого прыщика на лице есть причина!... | Циклический шрифт в стиле модерн от Leon Hulst... |