Отправляет email-рассылки с помощью сервиса Sendsay

[TC] JavaScript: переключение CSS

Здравствуйте, господа.
Имеется потребность реализовать средствами JavaScript переключение
используемой таблицы стилей.
В Интернете нашёл совет, воспользоваться для этого функцией
{
document.getElementById('style').href = css
}
где в качестве строкового параметра "css" предлагается передавать ей имя
альтернативной таблицы.
Однако заставить работать эту конструкцию мне так и не удалось в связи с чем
вопрос:
Как конкретно надо использовать эту функцию, или, если это не удачный
вариант, как ещё можно средствами JS реализовать переключение стилей на
странице?
Ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn.

Ответить   "Cthulhu fhtagn" Sat, 7 Aug 2010 16:46:55 +0400 (#1161768)

 

Ответы:

Vande omentaina, Cthulhu fhtagn!

А вы уверены, что у вас айдишник тот же?
попробуйте:
<link id="toChange" href="blah.css">
И по этому айдишнику поменять той функцией.
Если не выйдет, пишите)

Ответить   Sat, 7 Aug 2010 16:42:27 +0300 (#1161789)

 

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

Да, я уже по-всякому пытался, но как-то не срабатывает.
Не могли бы вы показать более полный пример?
Плюс почему-то в некоторых местах пишут, что подгружаемые скриптом стили
следует оформлять как альтернативные, то есть в link писать rel="alternate
stylesheet", а в других испочниках этот вопрос как-то не поднимается.
Не могли бы вы прояснить ещё и этот момент?
Спасибо.
Ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn.

Ответить   "Cthulhu fhtagn" Sat, 7 Aug 2010 18:15:39 +0400 (#1161806)

 

Приветствую всех.

Это значение атрибута rel обозначает альтернативные таблицы стилей. Если браузер
поддерживает альтернативные таблицы стилей, то их можно менять средствами браузера
(обычно через пункт в меню "Вид"), то есть реализация смены таблиц стилей при
помощи javascript это не просто велосипед, это плохой велосипед.
Тем не менее... Есть, как минимум, два варианта сделать это: поменять href у
текущей таблицы стилей или сменить таблицу стилей на одну из альтернативных
(для первого варианта нужно загружать лишь одну таблицу и альтернативные таблицы
не нужны; для второго варианта, разумеется, нужно загружать остальные таблицы
как альтернативные).

Список таблиц стилей: document.styleSheets
Конкретная таблица стилей (например, вторая по порядку):
document.styleSheets[1]
или
document.styleSheets.item(1)
Свойство href:
document.styleSheets[1].href
Набор свойств для элементов document.styleSheets зависит от браузера.
В Firefox есть еще коллекция document.styleSheetSets , поэтому в этом браузере
сменить текущую таблицу стилей на одну из альтернативных можно так
document.selectedStyleSheetSet = document.styleSheetSets [1];
Есть ли такое в IE7/IE8 -- не знаю.

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

Успехов. Анатолий.

Ответить   "i_chay" Sat, 7 Aug 2010 19:29:55 +0400 (#1161830)

 

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

Конечно, Анатолий, вы правы. Только вот поддержка выбора альтернативных
стилей через пользовательское меню в том же IE появилась только с 8, поэтому
эта фишка не популярна среди web-разработчиков, а среди пользователей вообще
малоизвестна. Да и о чём можно говорить, когда даже CTRL+Scroller многие до
сих пор не освоили, поэтому много где введена функция изменения размера
шрифта.
К тому же, как мне помнится, тот же FF нормально съест rel="stylesheet
alternate", как много где и верстают, а вот у IE на такой конструкции
случится несварение, ему alternate надо подавать только в начале. Поэтому
даже многие сайты с поддержкой этой фишки на 100% в IE вроде как не
доступны. Так что пока альтернативные стили в том виде, как их планировали
разработчики - большая редкость.
Да и вообще, к сожалению, web - это часто компромис между тем, как надо, и
тем, что хочет увидеть посетитель. Наверное именно поэтому, так трудно в
сети найти 100-процентно валидный сайт. :)
Однако возможно вы и правы, что не надо дублировать браузерные функции.
Но на последок хочу всё-таки спросить для успокоения:
<link rel="stylesheet" media="all" type="text/css" href="default.css">
<link rel="alternate stylesheet" media="all" type="text/css"
title="Контрастная схема" href="contrasting.css">
Сам по себе это кросбраузерный вариант для тех обозревателей, которые вообще
поддерживают фишку альтернативных стилей?
Ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn.

Ответить   "Cthulhu fhtagn" Sat, 7 Aug 2010 21:01:59 +0400 (#1161884)

 

Приветствую всех.

Мне говорили, что это было уже в IE7. Разве не так?

Или не подавать вообще . Ссылки на внешние таблицы стилей IE накапливает (по
крайней мере, так вел себя IE6).

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

Успехов. Анатолий.

Ответить   "i_chay" Sun, 8 Aug 2010 23:35:14 +0400 (#1162755)

 

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

Вроде всё-таки нет. По крайней мере здесь пишут по-другому:
http://blogs.msdn.com/b/ieru/archive/2008/12/22/css-ie8-beta-2.aspx
Честно говоря, IE 7 я как-то просабатировал в отношении дитального изучения,
поэтому собственных столь подробных впечатлений не осталось. Но в меню я там
такой пункт, действительно, не помню.

Но это вроде не страшно. Таблица без title по спецификации должна в этом
меню отображаться как стандартная автоматически. Главное чтобы остальные CSS
браузер увидел.
Спасибо за ликбез.
Ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn.
Ph'nglui mglw'nafh Cthulhu R'lyeh wgah'nagl fhtagn.

Ответить   "Cthulhu fhtagn" Mon, 9 Aug 2010 00:14:32 +0400 (#1162789)