Немного фоновой динамики с Particles.js

Решил слегка поправить шаблоны блога, выровнять отступы, сгладить контраст цветов, заодно расстался с угрюмой фоновой сеткой.

Хотелось добавить какой то динамики, чтобы что то происходило, двигалось, вращалось и т.п. На заре сайтостроительства вебмастера пытались перещеголять друг друга, используя анимированные gif-ки. Одни и те же картинки приходилось встречать на разных сайтах, выглядело это аляповато, демонстрировало отсутствие вкуса, стимулируя закрыть побыстрее сайт.

Particles.js

GITHUB: https://github.com/VincentGarreau/particles.js

Скриптованная анимация с использованием canvas — это довольно свежий взгляд на старую задачу о том как бы добавить движухи в статическую верстку сайта. Я уж думал что то придумать сам, но нашел это готовое решение.

Плюсы:

  • легкий скрипт, конкурирует даже с самыми простыми фоновыми картинками по размеру,
  • всегда разная, живая картинка,
  • возможность проявить творчество и задать свои неповторимые настройки (характер, скорость движения, прорисовку связей и т.п.)

Я подключил скрипт к фоновому слою, а-ля «звездное небо, проплывающее за лентой сайта».

Для этого слоя понадобятся стили вроде:

На демо-сайте вы найдете несколько готовых конфигураций, демонстрирующих применение скрипта.

P.S.

Как оказалось, скрипт может сильно снижать скорость работы браузера на некоторых машинах. По всей видимости, страдают 1-2 ядерный системы. По просьбам трудящихся пришлось отключить красоту. :)

Мало букафф? Читайте есчо !

Значение UNIX timestamp в javascript

Январь 8, 2018 г.

Привычный в PHP и SQL тип данных timestamp отсутствует в javascript. Стоит ли говорить, что timestamp удобен для сравнения дат и для простых вычислений. Как получить его значение в JS? В Javascript есть класс для работы с датами. [crayon-6895c3df312d2559210579/] ...

Читать

Добавляем свой фильтр в TWIG на Drupal

Июнь 1, 2023 г.

В TWIG уже много разных встроенных фильтров, Drupal их перечень только расширяет. Но наше счастье было бы не полным, если бы мы не могли добавить свои фильтры. В Drupal это делается через сервис twig.extension. Для начала надо сформировать описатель, ...

Читать

WP Plugin Core Settings

Август 20, 2018 г.

В Wordpress много настроек прячется на уровне доступном только веб-разработчику. Т.е. чтобы изменить их, вам нужно хоть немного разбираться в программировании. Это не меняет общей концепции WP как блога, готового к работе из коробки. Но вновь введенные ...

Читать

Добавляем flash (swf) файлы в медиатеку сайта на Wordpress

Июнь 20, 2016 г.

Файлы Adobe Flash с расширением .swf нельзя загрузить в wordpress из коробки. Сделано так не без веских на то оснований. Но если вы осознаёте риски, то ...

Читать
 

Комментарии к «Немного фоновой динамики с Particles.js»

Понравилась статья? Есть вопросы? - пишите в комментариях.



Комментарий: