PDA

Просмотр полной версии : Возможна ли динамическая смена css?


Илья
23.01.2011, 05:48
Привет.
Мне необходимо менять css на сайте в зависимости от времени суток НА КЛИЕНТЕ (НЕ НА СЕРВЕРЕ!). В этой связи кто-нибудь подскажет возможно ли в TS получить это самое время (пока склоняюсь к тому что технически это невозможно для Typo, да и не только для нее), чтобы вставить в условие?
Пока у меня работает только JS, который берет время Date(); и успешно меняет css, но все это работает до тех пор, пока не интегрируется в typo3.
После включения JS через TS почему то перестает отрабатывать...
Подключаю файл в TS так:
page.includeJS.file10 =
файл подключается, но не работает. Остальные js скрипты, подключаемые аналогично работают нормально.
Что посоветуете?
Возможно есть более простое решение для задачи?

-=UncleByte=-
23.01.2011, 06:35
Скорее всего самое простое это переключение всего css при помощи jQuery и ему подобных библиотек.

Илья
23.01.2011, 06:40
Спасибо за ответ, а как брать время клиентского компа? или jquery и это умеет? (хотя я не удивлясь!)
... немного подумав...
скорее всего действительно умеет, пойду почитаю мануал...

Илья
25.01.2011, 06:22
Вот рабочий результат, который через jquery меняет css в зависимости от времени суток на компе юзера.
Код кривой, но главное что работает...
Вдруг кому поможет...
function getCSS()
{
datetoday = new Date();
timenow=datetoday.getTime();
datetoday.setTime(timenow);
thehour = datetoday.getHours();

if (thehour > 18)
display = "evening.css";
else if (thehour > 12)
display = "day.css";
else if (thehour > 6)
display = "morning.css";
else if (thehour > 0)
display = "night.css";
else
display = "day.css";
}

getCSS();


$.extend({
includePath: 'fileadmin/templates/',
include: function(file) {
var files = typeof file == "string" ? [file]:file;
for (var i = 0; i < files.length; i++) {
var name = files[i].replace(/^\s|\s$/g, "");
var att = name.split('.');
var ext = att[att.length - 1].toLowerCase();
var isCSS = ext == "css";
var tag = isCSS ? "link" : "script";
var attr = isCSS ? " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' ";
var link = (isCSS ? "href" : "src") + "='" + $.includePath + name + "'";
if ($(tag + "[" + link + "]").length == 0) document.write("<" + tag + attr + link + "></" + tag + ">");

}
}
});


$.include(display);