СМЕНА дизайна(или стиля) кнопочками
Поглядеть Живьём >http://hostjs-mybb2011.narod.ru/ChangeStyle.htm
В Начало HTML верх:
<script type="text/javascript"> var linkStyles='<link rel="stylesheet" type="text/css" href="'; function setcookie(a,b,c) {if(c){var d = new Date();d.setDate(d.getDate()+c);}if(a && b) document.cookie = a+'='+b+(c ? '; expires='+d.toUTCString() : '');else return false;} function getcookie(a) {var b = new RegExp(a+'=([^;]){1,}');var c = b.exec(document.cookie);if(c) c = c[0].split('=');else return false;return c[1] ? c[1] : false;} function clearSet(L){if(L){setcookie("changeStyle",L,30);$("link[rel='stylesheet']:first").replaceWith(linkStyles+L+'"/>')}};var Lmem=getcookie("changeStyle");clearSet(Lmem); </script>
Сразу следом, - ставим наши кнопки
<style>#changeStyle img{border:solid 2px transparent;}
.STYLselect {border-color:red!important;}
</style>
<div id="changeStyle" style="top:0; left: 3px; position:fixed!important;">
<img src="http://www.10pix.ru/img1/3444/5439522.jpg" alt="http://forum.mybb.ru/style/Mybb_Strange_Vision/Mybb_Strange_Vision.css"/>
<br>
<img src="http://www.10pix.ru/img1/3492/5439523.jpg" alt="http://forum.mybb.ru/style/Mybb_Space/Mybb_Space.css"/>
<br>
<img src="http://www.10pix.ru/img1/3492/5439523.jpg" alt="http://forum.mybb.ru/style/Mybb_Sloven/Mybb_Sloven.css"/>
<br>
</div><script>$("#changeStyle img[alt='"+Lmem+"']").addClass("STYLselect");$('#changeStyle img[alt]').click(function(){L=$(this).attr("alt");$('#changeStyle img[alt]').removeClass("STYLselect");$(this).addClass("STYLselect");clearSet(L)});</script>
Пояснения:
Красным - ссылки на картинки соответствующих кнопок
Коричневым жирным - ссылки на файлы стиля для этой кнопки
Синим жирным - стиль кнопки после нажатия
Дополнения:
Дополнительные Контейнеры для HTML контента, подключаемые только к Определенному выбираемому Стилю Пост 979
(Ссылки на файлы стиля можно брать со своего тестовика или заливать на хостинг, к примеру этот > http://www.nextmail.ru/
Для получения Ссылки на стиль Со Своего Тестовика:
Cтавите: Временно,на данном форуме в HTML низ, самый низ Кнопку получения Стиля
(Кнопка будет в самом низу слево
<!--Кнопка получения Стиля--> <script type="text/javascript"> var L2='',L='<p style="float:left;"><button id="lnkCss">Ccылка на сss</button></p>'; $(document).ready(function(){$("#pun-about .container").append(L); $("#lnkCss").click(function (){L=$("link[rel='stylesheet']").attr("href"); L2=L.replace(/style\.(\d*)\.css$/i,"style_cs.$1.css"); if(L2==L){L2=L.replace(/\/([^\/]*)\.css$/i,"/$1_cs.css")}; alert("Ссылка на первое Окно стиля >\n\n"+L+"\n") alert("Ссылка на Второе Окно стиля >\n\n"+L2+"\n");});}); </script>
При первом Клике - Получаете ссылку на Первое Окно стиля
При втором клике - Получаем Ссылку на Второе Окно стиля
При использовании стиля прямо с тестовика - первой ссылки достаточно для вставки в одну кнопку скрипта смены стиля
---
Для Заливки же - Объединённого файла Стиля на хостинг хранения (*и использования уже этой ссылки -залитого объединенного файла) необходимо удалить целиком в Первом Окне пункт /* A1.1 */
/* A1.1 */
@import url(Ла Ла Ла);
Второе Окно Стиля ставим в любом текстовом редакторе впереди первого и сохраняем объединенный стиль с расширением .css
Итоговый файл, с расширением .css заливаем на хостинг хранения(см выше), ccылку вставляем в код соответствующей кнопки
Теги: Новые Скрипты