dr.Brain

doctor Brain

мир глазами веб-разработчика

JavaScript: цвет страницы

динамически меняем цвет страницы с помощью JavaScript и CSS

dr.Brain

время чтения 1 мин.

Photo by David Clode on Unsplash

С помощью свойства CSS ‘filter’ и JavaScript можно динамически менять цвет страницы:

<a href='javascript:document.querySelector("html").setAttribute("style","filter: saturate(60%) brightness(80%);")'>
  pastel
</a>

<a href='javascript:document.querySelector("html").setAttribute("style","filter: grayscale(100%);")'>
  grayscale
</a>

<a href='javascript:document.querySelector("html").setAttribute("style","filter:")'>
  normal
</a>

Следует помонить, что свойство filter не меняет непосредственно цвет выводимого на странице контента, а применяет такие графические эффекты, как размытие и смещение цвета. В связи с этим, фильтры обычно используются для регулировки рендеринга изображений, фонов и рамок.


Спасибо за внимание.

Новые публикации

Далее

Категории

О нас

Frontend & Backend. Статьи, обзоры, заметки, код, уроки.