Техническая поддержка сервиса Quadro.Boards

Объявление

Новости сервиса

О форуме

Quadro.Support – это форум технической поддержки различных проектов и сервисов Quadro.Systems LLC, на котором грамотные технические специалисты всегда смогут помочь вам в решении проблем, или же подсказать ответы на самые сложные вопросы. Так же на форуме собрана обширная база знаний по различным аспектам наших сервисов. Не забывайте пользоваться поиском ;)

Информация о пользователе

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Смена стиля кнопками. Deff


Смена стиля кнопками. Deff

Сообщений 41 страница 60 из 60

1

http://uploads.ru/t/j/a/X/jaXJ4.gif

В Начало 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 контента,
подключаемые только к Определенному выбираемому Стилю

Иногда необходимо поставить к каждому стилю свою картинку в Объявлении(или вообще сменить объявлении или заменить скрипт( к примеру: скрипт установки "Cвоя Картинка к каждой категории", или убрать-поставить: сайдбар, или Инфопанель от Duka, или слайдер, либо обрамление чего-то в рамку )

Для начала делаем добавку красным в  скрипт, стоящий ниже кнопок (см. Ссылку Выше:
(проще заменить весь скрипт целиком отсюда)

<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крипты, кроме сss) - просто обрамляем его в выделенное жирным,
Красным - жирным - ссылка на Стиль - к которому данный кусок Вашего кода будет подключаться
(контейнеров для каждого стиля может быть несколько.

<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>

Ps:Контейнер не позволяет вставлять код css. Дополнительные Коды css добавляем в  конец Первого Окна стиля(если используем его), либо в конец загружаемого файла данного Стиля.

Зы2: При комбинации с дополнительным css в переключаемых стилях, дефолтный стиль часто удобно прописывать в Первом Окне стиля чисто ссылкой на внешний, загружаемый файл этого Стиля, поскольку ссылка на данный файл не меняется, в отличии от ссылок на Окна стиля...

Т.е прописываем тогда единственный Оператор в первом Окне на странице Стиля:

/*************************************************************
A - SETUP
**************************************************************/

/* A0 Import default Style
-------------------------------------------------------------*/

/* A0.1 */
  @import url(Ccылка на файл Стиля по умолчанию);

-----------------------------

(Ссылки на файлы стиля можно брать со своего тестовика или заливать на хостинг, к примеру этот > 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ылку вставляем в код соответствующей кнопки.

автор: Deff
ссылка на оригинал
демо: hostjs-mybb2011.narod.ru

Теги: Скрипты и дополнения, Главная страница,свой стиль,смена стиля

+1

41

Deff написал(а):

Ну ждём юзера, разрешить ситуёвину

summer написал(а):

Опять что-ли?

не уверена, требуется ли до сих пор мое участие в разговоре, однако уточню: и в моем собственном, и в случае коллеги-администратора пустой каркас мелькает при каждом переходе по страницам, вне зависимости от выбранного / дефолтного стиля.

0

42

таис афинская
На тестовом форуме не русфф от summer => http://danu.mybb.ru/  Вы наблюдаете данный эффект, или нет ?
Ксать спасибо ей за демо +

0

43

Deff
да, на тестовом summer тоже его вижу.

0

44

таис афинская написал(а):

да, на тестовом summer тоже его вижу


У меня отсутствует с Оперы и Мозиллы ( Вы переходите по разным страницам форума  http://danu.mybb.ru/ (или обновляете страницу) с уже ранее нажатой кнопкой стиля и видите мелькание ?
Опыт нун повторить несколько раз для начального кеширования стилей
Переход по страницам мон сделать, к примеру, потыкав кнопки главного или юзер меню, или кликнуть на тестовое сообщение

Отредактировано Deff (06.11.2015 01:09:35)

0

45

Deff
да, по разным страницам, с разными выбранными стилями и сейчас зашла на форум уже в четвертый (с момента опубликования ссылки) раз с мозиллы и дважды проверила с хрома.

0

46

Deff написал(а):

Переход по страницам мон сделать, к примеру, потыкав кнопки главного или юзер меню, или кликнуть на тестовое сообщение

именно так я и поступаю))

0

47

таис афинская
Ну тады не наю:
Нун спросить ещё кого-нибудь, ибо скрипт делался для незаметного подключения выбранного стиля
Возможно связано со спецификой много-загруженных подпрограмм конкретного компутера.
Ведь время на браузер система выделяет исходя из общего кол-ва запущенных программ.
Основная нагрузка обычно от антивирусов и программ с обработкой событий в фоне

0

48

Deff
мне сейчас, к сожалению, некого подключить к тестированию, потому, боюсь, не смогу проверить теорию, извините. :dontknow:

0

49

таис афинская
Ну не к спеху, речь шла о том, что на rusff сейчас невозможно создать переключение без мельканий, посколь время проходящее от начала подгрузки страницы, до начала работы скрипта на текущем форуме ТП 0.48 секунды, занчит это время будет с неустановленным стилем. На сервисах без подобных скриптов, находящихся выше HTML верх, должно быть всё в норме

0

50

Deff написал(а):

Ксать спасибо ей за демо +

Ему :)

таис афинская написал(а):

мне сейчас, к сожалению, некого подключить к тестированию, потому, боюсь, не смогу проверить теорию, извините.

Есть мерцание при переходах, вот и видео:

+1

51

summer написал(а):

Есть мерцание при переходах, вот и видео:

1. У меня нет, возможно потому что ХР
2. Возможно нун отключить временно антивирус и плагины в браузере
Потестил еще под яндекс браузером - нет мельканий
2. Попробуйте заменить битые ссылки на кнопки(возможно они дают задержку)

0

52

Deff написал(а):

1. У меня нет, возможно потому что ХР

Едва ли

Deff написал(а):

2. Возможно нун отключить временно антивирус и плагины в браузере
Потестил еще под яндекс браузером - нет мельканий

Отключены

Deff написал(а):

2. Попробуйте заменить битые ссылки на кнопки(возможно они дают задержку)

Заменил, осталось так же. Проблема не в нагрузке, а в самом скрипте. Он ведь заменяет первый link stylesheet, это совсем незаметно пройти не может

0

53

summer написал(а):

Заменил, осталось так же. Проблема не в нагрузке, а в самом скрипте. Он ведь заменяет первый link stylesheet, это совсем незаметно пройти не может

Суть не в том что он заменяет, а через сколько заменяет!
Поэтому нун тестировать с конкретного компа время задержки от момента подгрузки стиля в хидере, до начала действия скрипта
Могу выложить своё видео:

=======================
Скрипт делалсо четыре года назад, у большинства было ХР или максимум виндовс Виста. Но за четыре года такой спичь о мельканиях(не на русфф) зашел впервые. Но возможно сегодня проблемы с подгрузкой с центрального сервиса скриптов и стилей с http://st0.bbcorp.ru/
Я говорил, что сегодня основной сервис тормозной
================================
На русфф во времена создания скрипта стояли ток награды, которые практически не тормозили и скрипт отлично работал и тут(Ксать Duka этот скрипт в своё время тестировал)

Отредактировано Deff (06.11.2015 03:34:20)

0

54

summer
Есть еще одна идея:
Что у Вас при тесте и создании видео  было  открыто много вкладок с сервиса русфф при тесте скрипта, comet-запросы и таймауты титла вкладки от присутствующих вкладок с сервиса русфф прерывают загрузку текущей страницы(ксать тоже говорил Дуке об идентификации и действия скриптов лишь на активной ( или последне-активной) вкладке.

Отредактировано Deff (06.11.2015 04:13:21)

0

55

Deff
Одна причина нелепее другой.
Хром, 1 единственная вкладка, ни одного плагина, браузер только установлен, специально для теста скрипта.
Не знаю, только если Хром знает, что открыт FF, а в нем открыта вкладка на qssupport и специально воспроизводит ошибку.
http://s3.uploads.ru/t/7IR0U.png

0

56

sadhaka, мне пофег, ранее работало без претензий(не на русфф), если нет, - выкидывайте скрипт ибо вариантов сделать иначе (без усилий со стороны партнёрки или центрального сервиса) и с более быстрой установкой стиля при переходе/обновлении страниц, - вряд ли есть. У меня на тесте от summer работает нормально, смотрите видео!

Как вариант: Дополните Лабу подобной фичей, думаю востребовано!
Основная идея: Добавлять скриптом лабы запомненный в куках class (styleN) соответствующий нужному стилю к body
Линк на стиль не меняется, просто для нужного стиля в Своём Стиле дописываем добавку

body.styleN cелектор {

Отредактировано Deff (06.11.2015 23:08:23)

0

57

Здравствуйте.

Мне не совсем понятно, что имеется в виду (рассматриваю возможность прикрепления дополнительных опций к определённому дизайну) в процитированном мною тексте. Куда конкретно вставляется этот кусок кода? Вместо чего-то?

rusff.ru написал(а):

А, в том же месте, где и стоял HTML-код для нужного дизайна(html и cкрипты, кроме сss) - просто обрамляем его в выделенное жирным,
Красным - жирным - ссылка на Стиль - к которому данный кусок Вашего кода будет подключаться


Второй вопрос конкретно про обрамляемый код - каким образом он должен обрамляться?
Третий — возможно ли прикреплять также и JS к дизайну? Что делать, если хочется к определённому дизайну прикрепить также скрипты из HTML-низа?

Заранее спасибо.

0

58

Ещё раз доброго времени суток.
Вопрос выше всё ещё является животрепещущим.

0

59

Li-Ihu написал(а):

Мне не совсем понятно, что имеется в виду (рассматриваю возможность прикрепления дополнительных опций к определённому дизайну) в процитированном мною тексте. Куда конкретно вставляется этот кусок кода? Вместо чего-то?

Чтобы у двух и более дизайнов были разные html-верх/html-низ, просто добавляете в html-верх или html-низ:

<style alt="ссылку на соответствующий вариант дизайна" class=OnlyThisStyle>/*
СЮДА ВСТАВЛЯЕТЕ КОД ДЛЯ НУЖНОГО ДИЗАЙНА
*/</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>

Li-Ihu написал(а):

Второй вопрос конкретно про обрамляемый код - каким образом он должен обрамляться?

Собственно, ответ на этот вопрос является ответом на ваш первый вопрос.

Li-Ihu написал(а):

Третий — возможно ли прикреплять также и JS к дизайну? Что делать, если хочется к определённому дизайну прикрепить также скрипты из HTML-низа?

Аналогично выше - делаете такие контейнеры для каждого дизайна и вставляете туда код. Туда можно вставить только html или js, стили (<style></style>) нельзя

0

60

Добра всем
Может у меня глаз замылился или мозг совсем в спячку ушел, но никак не могу разобраться с тем, куда девать шрифты. Дело вот в чем: поставила скрипт (смена стиля кнопками), все отлично работает, дизайны переключаются, стрелки прокрутки меняются вместе с дизайном, т.к. контейнеры тоже пашут, а вот шрифты - ни в какую. Пробовала их прописывать в сохраняемый файл css, пробовала прописывать в оба варианта, в структуру style.css кидала, когда там файл, пробовала и с самим дизайном... ну никак!

В качестве примера скрины подписи.

без скрипта\со скриптом
http://s9.uploads.ru/t/cXs50.png
http://s7.uploads.ru/t/3HTkF.png

Сам тестовик - http://rrr.rusff.ru

Буду рада совету))

0


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Скрипты и дополнения » Смена стиля кнопками. Deff


Рейтинг форумов | Создать форум бесплатно © 2007–2017 «QuadroSystems» LLC