ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка

Объявление

Поисковой ресурс

Проект от команды FD

Спойлеры

Загадочный Дом «Кузнечик»

Форумные игры, кино, позитивное отношение и душевное общение!
Есть в мире место, где душе тепло...
Заходи, мы будем тебе рады!

Подробнее

Мийрон

Качественный пиар быстро и недорого.
Красивейшие дизайны по низким ценам.
Каталог ролевых игр.

Подробнее

FD Chat - Чат на вашем форуме

Чат на отдельной странице на форуме. Без регистрации, используются форумные аккаунты.
Стоимость: 1500р
Первым 10 покупателям скидка 20%.

Подробнее

Макет для сайта «Fantasy Calalogue»

Детализированный макет «Fantasy catalogue» для тёмного дизайна многостраничного сайта
Стоимость при покупке эксклюзивно: 3600р
В стоимость входит корректировка макета и доработка недостающих страничек под ваш проект.

Подробнее

Поддержать проект

Если у вас есть желание помочь нам сделать наш проект лучше:
Реклама на сайтеПредложения
Стать модераторомОтзывы

Подробнее
Большая новость! Восстановление потерянного контента, уход одного админа и новое правило - обо всём читайте по ссылке.

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

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


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Портфолио команды » Изменение окраски дизайна в зависимости от времени суток


Изменение окраски дизайна в зависимости от времени суток

Сообщений 1 страница 5 из 5

1

[html]<link rel="stylesheet" href="https://forumstatic.ru/files/0007/e3/f7/40249.css">
<div id="port-block1" class="free">

<a class="tip" id="cover" title="Пример двух окрасок дизайна по принципу день и ночь">
  <div id="icon"></div>
  <img src="https://forumupload.ru/uploads/0007/e3/f7/2617/204890.jpg" class="postimg">
</a>

<div id="cover-block">
Дата: 2018г.<br>
Автор: <a href="/profile.php?id=6774" target="_blank">satsana</a><br>
Бесплатный скрипт<br>
Описание: Скрипт смены окраски дизайна в зависимости от времени суток.
</div>

</div>

<style>
.punbb .topicpost .post-content .spoiler-box {
border: 1px solid #26af33;
background-color: rgba(38,175,51,0.1);
}
.punbb .post-content .spoiler-box > div:hover {background-color: rgba(38,175,51,0.6);}
.punbb .post-content .spoiler-box > div {background-color: rgba(38,175,51,0.3);}
.post-content .spoiler-box > div.visible {background-color: rgba(38,175,51,0.8); color: #fff !important;}
#pun .punbb .post-content hr {border: 3px solid #279933;}
.post-content td {background-color: rgb(0,0,0,0.5) !important;}
.visible .quote-box {background-color: rgba(0,0,0,0.5);}
</style>[/html]

код и описание

Этот скрипт предполагает наличие общей разметки у всех установленных стилей, смену стилевых настроек отдельных элементов (как правило, это цвета фона, шрифта и рамок, картинки бэкграунда - см. пример таких дизайнов в скриншоте выше) в зависимости от времени суток.

Схож со скриптом Установка нескольких стилей в "свой стиль" без подгрузки файлов (по сути, является его предком), однако отличается тем, что варианты окраски дизайна меняются автоматически, в зависимости от того, во сколько посещается форум или сайт. (Скрипт ориентируется на часовой пояс пользователя.)

На сервисе mybb.ru и его партнёрах код скрипта устанавливается в блок "HTML верх" (в разделе "Формы"):

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

На других платформах код может быть установлен в поле, поддерживающее html-код. Требуется подключение библиотеки jQuery выше места расположения данного кода!

Дневной стиль, используемый по умолчанию, пишется как обычно, без указания стилевого класса, и размещается в полях "своего стиля" (или в в другом месте, где находятся css-коды вашего дизайна). Для изменения настроек отдельных элементов ночного стиля нужно добавить эти настройки в стиль ниже основных с добавлением в начало селектора класса .night.

Допустим, вы собираетесь использовать два стиля: дневной и ночной с классом .night. По умолчанию пишем "дневной" стиль. Все его настройки прописываются как обычно. По умолчанию вы прописываете фон и цвет шрифта для какого-то элемента так, как он должен выглядеть в дневном стиле. Для примера возьмём блок объявления:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

Для того, чтобы эти параметры изменились в ночном стиле, дописываем чуть ниже, добавив в начало селектора класс .night:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

Исключение составляет элемент body, для него стилевой селектор будет выглядеть так: body.night {}.

Временной промежуток, во время которого устанавливается ночная окраска, находится в сточке скрипта:

if (totd<5||totd>=21) $('body').addClass('night');

То есть, чтобы изменить время, когда у вас будет ночь, достаточно поменять цифры красным (они обозначают часы).

Если нужно больше двух вариантов перекрасок в течение суток, используем такой скрипт:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

В нём используется 4 класса: .morning, .day, .evening, .night для разных промежутков времени. Классов может быть больше или меньше, но нужно учитывать временные промежутки, все неучтённые часы получают класс .night:

else $('body').addClass('night');

ВАЖНО! Если у вас уже установлены скрипты, изменяющие класс body в зависимости от действий пользователя (например, Установка нескольких стилей в "свой стиль" без подгрузки файлов) - можно поменять селектор в скрипте с body на html или #pun_wrap, чтобы скрипты не конфликтовали, пересекаясь на одном элементе. Помните, что выбранный вами селектор, которому будет присваиваться нужный для стилизации класс, должен находиться в разметке выше места расположения скрипта!

Подпись автора

"You don't need to be protected,
Because nothing shocks you any more."
© Mesh
https://forumstatic.ru/files/0015/1e/ae/69675.gif https://forumstatic.ru/files/0018/3d/6c/77729.jpg

+3

2

Доброго времени. помогите, пожалуйста с скриптом  http://testmyfirum.rusff.me/

поменял это

Код:
html {
    background: url(https://forumupload.ru/uploads/0010/c7/6a/2/180209.png) fixed repeat top center; 
background-repeat: no-repeat; background-attachment: fixed;
  }

.night html {
 background-color: #050505; 
    background: url(https://forumupload.ru/uploads/0010/c7/6a/2/154555.png) fixed repeat top center; 
background-repeat: no-repeat; background-attachment: fixed;
}

на

Код:
body {
    background: url(https://forumupload.ru/uploads/0010/c7/6a/2/180209.png) fixed repeat top center; 
background-repeat: no-repeat; background-attachment: fixed;
  }

.night body {
 background-color: #050505; 
    background: url(https://forumupload.ru/uploads/0010/c7/6a/2/154555.png) fixed repeat top center; 
background-repeat: no-repeat; background-attachment: fixed;
}

и это

Код:
body {
    background:transparent url(https://forumupload.ru/uploads/0010/c7/6a/2/339783.png) center top no-repeat;
    padding-top: 226px !important; 
padding-left: -15px !important;
    }

на

Код:
#pun-title {
    background:transparent url(https://forumupload.ru/uploads/0010/c7/6a/2/339783.png) center top no-repeat;
    padding-top: 226px !important; 
padding-left: -15px !important;
    }

в скрипте если указываешь body ничего не меняется, а если html то фон появляется ночного. но при этом на дневной не переходит, но при захождении в админку фон уже дневной всегда. но при этом шапка пропала, вот так должно быть https://i.imgur.com/k4xE2HZm.png

походу что-то не так делаю.

если просто в скрипте поменять на html,то ничего не меняется...

Отредактировано Боско (31.01.22 08:03)

+1

3

Боско
Здравствуйте, попрошу автора скрипта зайти и подсказать вам.

Подпись автора

"You don't need to be protected,
Because nothing shocks you any more."
© Mesh
https://forumstatic.ru/files/0015/1e/ae/69675.gif https://forumstatic.ru/files/0018/3d/6c/77729.jpg

+2

4

Боско, доброго.
Когда класс присваивается элементу body, вот такая конструкция работать не будет:

.night body

Вместо этого нужно писать body.night

#p164494,Боско написал(а):

при захождении в админку фон уже дневной всегда

В админке не срабатывают установленные в html-верх/низ скрипты. (А также на странице переадресации.) Так что там вы никаких изменений не увидите.

#p164494,Боско написал(а):

фон появляется ночного. но при этом на дневной не переходит

Вы же в скрипте прописали переход на дневной режим в 10 утра. Вот он в 10 и переходит, я только что проверила. (У меня как раз 10.)

+3

5

Automation Baby
satsana все, спасибо огромное, проблема решена  :D

+1

Быстрый ответ

Напишите ваше сообщение и нажмите «Отправить»


ВНИМАНИЕ! При обращении за техподдержкой и вопросами по скриптам/оформлению, оставляй ссылку на форум/сайт с проблемой! Специалист должен вживую видеть проблему, чтобы подсказать как ее решить.

ВНИМАНИЕ! Гости (не зарегистрированные на форуме) могут писать сообщения, но не могут вставлять прямые ссылки! Чтобы оставить сообщение со ссылкой на сайт, форум или скриншот удали символы: "http://", "https://" или "www."


Вы здесь » ForumD.ru - Дизайн для форумов, скрипты для форумов, техническая поддержка » Портфолио команды » Изменение окраски дизайна в зависимости от времени суток