Внедрение CSS на сайт - PullRequest
       16

Внедрение CSS на сайт

1 голос
/ 09 августа 2011

Я создаю расширение для браузера, которое позволит вам настроить CSS страницы.
По сути, если пользователь выбирает темный фон со светлым текстом, то это изменение должно отражать на сайте, что онипросмотр.
Причиной этого является удобочитаемость.
Людям, страдающим дальтонизмом и некоторыми нарушениями зрения, трудно читать некоторые цвета.

С этим связано несколько проблем.
Я хочучтобы иметь возможность изменить элементы background-color на выбранный цвет фона, а элемент color на выбранный цвет текста.

Очевидно, что я должен учитывать сложные макеты веб-сайтов и учитывать те сложные правила, т.е.

#container div.note p

Я могу использовать в этом Javascript, но нет таких библиотек, как JQuery, поэтомуесть ли способ сделать это?

Есть ли способ применить таблицу стилей CSS к странице, которая переопределит каждый элемент фона и каждый элемент цвета в их таблице стилей?

1 Ответ

4 голосов
/ 09 августа 2011

Я предлагаю написать для этого сценарий GreaseMonkey , поскольку он позволит вам установить правило для запуска на каждой странице сайта. GM - просто оболочка для JavaScript (хотя она также расширяет функциональность).

И нет, нетрудно написать скрипт, который применяет таблицу стилей CSS. Просто создайте элемент <link>, ссылающийся на него. В качестве альтернативы вы можете жестко закодировать стиль и создать объект <style> на странице.

Посмотрите на эту статью: Динамическая загрузка внешних файлов JavaScript и CSS

function loadcssfile(filename){
  var fileref=document.createElement("link")
  fileref.setAttribute("rel", "stylesheet")
  fileref.setAttribute("type", "text/css")
  fileref.setAttribute("href", filename)

 if (typeof fileref!="undefined")
  document.getElementsByTagName("head")[0].appendChild(fileref)
}

loadcssfile("mystyle.css") ////dynamically load and add this .css file
...