СМЕНА дизайна (или стиля) кнопочками
Стиль форума/сайта будет меняться по клику на кнопки.
Авторы: Астарта, @azzt, @Deff
Версия, где можно обновлять дизайн не дожидаясь обновления куки.
При изменениях нужно обновлять designVersion. Также поправьте строчку SOME ID на какой-нибудь айдишник для вашего удобства.
Автор: Deff
Платформа: любая
Демо: http://hostjs-mybb2011.narod.ru/ChangeStyle.htm
В Начало HTML верх:
Сразу следом, - ставим наши кнопки
Пояснения:
Красным - ссылки на картинки соответствующих кнопок
Коричневым жирным - ссылки на файлы стиля для этой кнопки
Синим жирным - стиль кнопки после нажатия
1. Ссылки на файлы стиля можно брать со своего тестовика или заливать на хостинг
2. Для Заливки Объединённого файла Стиля (и использования уже этой ссылки объединенного файла в скрипте) в админке необходимо удалить целиком в Первом Окне пункт /* A1.1 *//* A1.1 */
@import url(Ла Ла Ла);Второе Окно Стиля ставим в любом текстовом редакторе впереди первого и сохраняем объединенный стиль с расширением .css
Итоговый файл с расширением .css заливаем в админке, ccылку вставляем в код соответствующей кнопки
Дополнительные Контейнеры для HTML контента,
подключаемые только к Определенному выбираемому Стилю
Иногда необходимо поставить к каждому стилю свою картинку в каком-либо блоке, вообще сменить весь контент блока или заменить скрипт (к примеру: скрипт установки "Cвоя Картинка к каждой категории" или убрать-поставить: сайдбар, или юзер-панель, или слайдер, либо обрамление чего-то в рамку)
Для начала делаем добавку красным в скрипт, стоящий ниже кнопок
(проще заменить весь скрипт целиком отсюда)
<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);window.location=document.URL.replace(/#.\d+$/img,"");});</script>
А, в том же месте, где и стоял HTML-код для нужного дизайна (html или cкрипты) - просто обрамляем его в выделенное жирным:
<style alt="http://forum.mybb.ru/style/Mybb_Bend/Mybb_Bend.css" class=OnlyThisStyle>/*
Тут Обрамляемый Код (*cкрипты и HTML для стиля по ссылке Красным,)
*/</style>
<script>var L=$("link[rel='stylesheet']:first").attr('href');var V=$("style.OnlyThisStyle[alt='"+L+"']");if(V.html()!=null){var V1=V.html().replace(/^\/\*([\s\S]*)\*\//img,"$1");V.replaceWith(V1);}</script>
Красным жирным - ссылка на Стиль, к которому данный кусок Вашего кода будет подключаться (контейнеров для каждого стиля может быть несколько).
ВНИМАНИЕ!!!: Контейнер не позволяет вставлять код css. Дополнительные Коды css добавляем в стиль сайта/форума (по умолчанию) или в стиль подгружаемого файла стилей по клику на кнопку!
Более современные решения от спецов FD:
Отредактировано Герда (20.05.13 07:29)
- Подпись автора
Просьба не писать в ЛС, этот аккаунт исключительно для публикаций.