Не нравятся результаты поиска? Попробуйте другой поиск!

DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Смена оформления по дням недели

Смена оформления по дням недели

ravchik 25.01.2012 js, css Все вопросы » Общие вопросы по вёрстке 5871

вопрос

Доброго времени суток.
Возникла необходимость менять дизайн сайта на определнный день недели (пятницу), но в остальные дни дизайн должен оставаться стандартным. Полагаю, это возможно сделать при помощи javascript (смена CSS-стиля). В JS не то что 0, а скорее -1
З.Ы. Подсказали такой скрипт

<link rel="stylesheet" href="{THEME}/css/style.css" type="text/css" media="screen, projection" />
<script>
(function(){
  var date = new Date(),
      time = +date,
      day = ( 12 - date.getDay() ) % 7;
  function friday(){
    document.getElementsByTagName('link')[0].setAttribute('href', '{THEME}/css/friday.css')
  }
  if(day) {//не пятница
    date.setDate( date.getDate() + day )
    date.setHours( 0, 0, 0, 0 )
    setTimeout( friday , date - time )
  }else{  //пятница
    friday()
  }
})()
</script>

но он не работает...

Ответил: MozgFx

Подобное было реализовано немного проще...
Если Вам надо менять только таблицу стилей, а не менять шаблон то вот образец реализованый на Джумле:
[leech=http://neojoomla.com/demo/templates/clockingmachine/]ClockingMachine[/leech]

В код вставляем две строки перед тегом head:

<script language="javascript" type="text/javascript" src="http://www.neojoomla.com/demo/templates/clockingmachine/templates/clockingmachine/getcss.js"></script>

<script type="text/javascript">
    getCSS( 'http://www.neojoomla.com/demo/templates/clockingmachine/templates/clockingmachine' );
</script>

Сам файл getcss.js выглядит вот так:

function getCSS( templatepath ) {
 
    datetoday   = new Date();
    timenow        = datetoday.getTime();
    datetoday.setTime(timenow);
    thehour     = datetoday.getHours();
    
    
    if (thehour >= 21) {
        display = "night.css";
    }else if (thehour >= 18) {
        display = "sunset.css";
    }else if (thehour >= 10) {
        display = "noon.css";
    }else if (thehour >= 7) {
        display = "morning.css";
    }else if (thehour >= 0) {
        display = "night.css";
    }else{
        display = "sunset.css";
    }
    var css = '<link href="' + templatepath + '/css/' + display + '" rel="stylesheet" type="text/css" />';
    
    document.write(css);
}

Здесь шаблон меняется от времени суток но подправить для дней не составит сложности даже для Вас. Включите немого логики и все получиться.

11 комментариев

Юзер

MozgFx - 2015-05-1327 января 2012 10:04 - #3333

А вот и нужная Вам переменная!!!
По ссылке найдите 5й пункт там все расписано:

http://web-disign.ru/spiski_javascript.html

Юзер

453

ravchik - 2015-05-1327 января 2012 12:03 - #3335

Попытался сделать, получилось так:
код в main.tpl

<script language="javascript" type="text/javascript" src="{THEME/css}/fr.js"></script>
<script type="text/javascript">
    getCSS( '{THEME}' );
</script>

Предварительно убрал обычный <link href=".../style.css".. />

код в fr.js

function getCSS( {THEME} ) {

// Инициируем новый объект типа Date
today = new Date()
// Получаем текущий день недели, 0 - воскресенье, 1 - понедельник и т.д.
day = today.getDay()    
    
    if (day = 5) {
        display = "friday.css";
    }else{
        display = "style.css";
    }
    var css = '<link href="' + {THEME} + '/css/' + display + '" rel="stylesheet" type="text/css" />';
    
    document.write(css);
}

...Не работает
Не выводит ни обычный style.css, ни friday.css..
Что я сделал не так?

Местный

test-templates - 2015-05-1328 января 2012 01:40 - #3359

код {THEME} в js не обрабатывается, пишите полный путь

Юзер

453

ravchik - 2015-05-1328 января 2012 14:27 - #3370

test-templates, указывал и абсолютный путь, не работает :(
он не только не меняет CSS, но и не вставляет обычный ксс

Админ

3457

ПафНутиЙ - 2015-05-1328 января 2012 14:38 - #3372

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

Каков вопрос - таков и ответ. Просто помните об этом.

Юзер

453

ravchik - 2015-05-1328 января 2012 14:43 - #3373

Может кому понадобится - окончательный РАБОТАЮЩИЙ вариант:

<script language="javascript">
function getCSS() {
// Инициируем новый объект типа Date
today = new Date()
// Получаем текущий день недели, 0 - воскресенье, 1 - понедельник и т.д.
day = today.getDay()    
    if (day == 5) {
        display = "абсолютный путь/friday.css";
    }else{
        display = "абсолютный путь/style.css";
    }
    var css = '<'; css+='link rel="stylesheet" href=' + display + ' \/'; css+='>';    
    document.write(css);
}
</script>

<script language="javascript">
    getCSS(); 
</script>

Юзер

562

Апельсин - 2015-05-1319 декабря 2015 07:37 - #51153

у меня не работает, а очень надо...

Юзер

djgelius - 2015-05-1312 августа 2013 22:55 - #15612

мне нужно подобное только выводить код со слайдера в дни недели! Афиши!
как это все реализовать?

<script language="javascript">
function getCSS() {
// Инициируем новый объект типа Date
today = new Date()
// Получаем текущий день недели, 0 - воскресенье, 1 - понедельник и т.д.
day = today.getDay()    
    if (day == 5) {
        display = "абсолютный путь/friday.css";
    }else{
        display = "абсолютный путь/style.css";
    }
    var css = '<'; css+='link rel="stylesheet" href=' + display + ' \/'; css+='>';    
    document.write(css);
}
</script>
 
<script language="javascript">
    getCSS(); 
</script>

Юзер

453

ravchik - 2015-05-1319 декабря 2015 18:38 - #51162

<script>
$(document).ready(function()
{
    var today = new Date();
    var day = today.getDay();    
    if (day == 5) // в пятницу
        $("#slider").load("путь к файлу с кодем слайдера для пятницы");
    else if (day == 6) // в субботу и далее по аналогии
        $("#slider").load("путь к файлу с кодем слайдера для субботы");
});
</script>

<div id="slider">тут будет загружен код слайдера</div>

вроде должно работать, не проверял

Юзер

djgelius - 2015-05-1319 декабря 2015 19:29 - #51163

ravchik,спсибо уже не нужно но такой вопрос мне нужно выводить код плеера еженедельно в определенное время как это сделать?
Например каждое воскресенье с 22 до 23 часов

Юзер

Abe - 2015-05-1323 февраля 2016 14:38 - #53082

в любой из версий можно реализовать с помощью небольшого добавления в index.php и собственно CSS

Похожие вопросы

Последние события

Darkzone | Выбор категории для доп. поля? ⁴

Darkzone
Выбор категории для доп. поля?
Вчера, 17:08

Разъясните как вытащить id?
lutskboy | Вытащить все данные из определенного доп ... ¹

lutskboy
Вытащить все данные из определенного доп поля?
Вчера, 16:17

в adminer можно.

lutskboy | Выбор категории для доп. поля? ⁴

lutskboy
Выбор категории для доп. поля?
Вчера, 16:14

выбрать все кроме такого нет. можно с бд достать все ид через запятую и вставить в xfields.txt
js скрипт можно написать


<script>
    window.addEventListener('load', ()=> {
        $('#category').on('change', function() {
            var value = $(this).val();
            if ($.isArray(value)) {
            	ShowOrHideEx("xfield_holder_year", jQuery.inArray('1', value) != -1 || jQuery.inArray('2', value) != -1 );
            } else {
            	ShowOrHideEx("xfield_holder_year", value == 1 || value==2);
            }
        })
    });
</script>
year доп поле . 1 и 2 катег

Darkzone | Выбор категории для доп. поля? ⁴

Darkzone
Выбор категории для доп. поля?
Вчера, 14:39

Смотрите, Нужно чтоб обязательное к заполнению доп. поле при добавлении новости, выводилось во всех категориях, кроме двух. Так как количество категорий довольно большое, есть ли способ, не тыкать каждую категорию в которой будет отображаться доп.поле. Надеюсь я смог разъяснить.
lutskboy | Выбор категории для доп. поля? ⁴

lutskboy
Выбор категории для доп. поля?
Вчера, 13:52

где выводить? админка или сайт
TeraMoune | Как отключить миниатюры стандартной гале ...
TeraMoune
Как отключить миниатюры стандартной галереи Fancybox?
21-11-2024, 06:00
В файле engine/classes/fancybox/fancybox.js искать нужную инициализацию и добавлять соответствующие параметры, весь список параметров и их описание можно найти на этой странице https://fancyapps.com/fancybox/api/options/

Например: параметр Thumbs: false отключает миниатюры.
```
Fancybox.bind("[data-highslide]", {
	groupAttr: 'data-highslide',
	idle:2000,
	Thumbs: false,
	caption: (fancybox, slide) => {
		if(  slide.thumbEl && slide.thumbEl.alt ) {
			return slide.thumbEl.alt
		}
	}
});
```
derebas | Как реализовать шифрование трафика? ³

derebas
Как реализовать шифрование трафика?
18-11-2024, 16:52

Ну в теории, можно использовать src на site.com разместить прокси на site2.com а выдавать видео с site3.com, при этом прямой доступ на site3.com закрыть, отдача будет только если запрос с site2.com, таким образом палится только site2.com, НО источник потокового видео, все равно можно увидеть если захотеть, а ссылки, ну купить домен dsac-43efew-csdds.uz как пример
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:46

я уже делал. Пользователь 1000 (это я так понимаю root) и chmod 777
Так и было...
lutskboy | Перенёс сайт - не работают кнопки, не от ... ⁸

lutskboy
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:39

чтоб не удалять выстави права и пользователя какие там идут на файлы. .
Gordi | Перенёс сайт - не работают кнопки, не от ... ⁸

Gordi
Перенёс сайт - не работают кнопки, не отображаются новости. Как вылечить?
18-11-2024, 14:37

т.е. мне снести всё, что я уже загрузил как root, зайти под юзером и закачать снова?
Видосы в директории upload можно хоть оставить? их там 80 Гб

наверх