Различия

Показаны различия между двумя версиями страницы.

--- software:development:demo:cms:ucms:application_template:install [2026/05/02 17:03] – внешнее изменение 127.0.0.1
+++ software:development:demo:cms:ucms:application_template:install [2026/05/02 17:25] (текущий) – [Фоновое изображение] VladPolskiy
@@ Строка 65: / Строка 65: @@
 </html>
 </note>
+===== particles-js настройка =====
+Настройка **%%particles.js%%** включает подключение библиотеки, создание контейнера (HTML) и инициализацию **(%%JSON-конфиг%%)**. Ключевые параметры: плотность **(%%number%%)**, размер **(%%size%%)**, скорость **(%%move%%)**, взаимодействие **(%%interactivity%%)**. Для работы как фона важно задать **%%position: absolute и z-index%%**. Используйте генератор для визуальной настройки.
+. Подключение и HTML \\
+{{ :software:development:demo:cms:ucms:application_template:particles.js-master.zip |Скачайте particles.min.js}} и подключите его в HTML. Создайте блок для анимации:
+<code html index.html>
+<div id="particles-js"></div>
+<script src="particles.min.js"></script>
+</code>
+. Стили (CSS)
+Чтобы частицы работали как фон:
+<code css style.css>
+#particles-js {
+  position: absolute; /* или fixed */
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+  z-index: -1; /* под контент */
+}
+</code>
+. Инициализация (JS)
+<code js script.js>
+javascriptparticlesJS.load('particles-js', 'particles.json', function() {
+  console.log('particles.js loaded');
+});
+</code>
+. Основные настройки **%%(particles.json)%%**
+  * **%%particles.number: value%%** - количество частиц
+  * **%%particles.color: value%%** - цвет **%%(hex, rgb)%%**
+  * **%%particles.shape:%%** тип **%%(circle, edge, triangle)%%**
+  * **%%particles.opacity:%%** прозрачность
+  * **%%particles.size:%%** размер частиц
+  * **%%particles.line_linked:%%** настройки линий между частицами (%%enable: true/false%%)
+  * **%%particles.move: speed%%** (скорость), %%direction%% (направление)
+  * **%%interactivity: onhover%%** (реакция на наведение), %%onclick%% (на клик).
+===== Дополнения и Файлы =====
+см. также:
+  * [[https://github.com/VincentGarreau/particles.js/|]]
+  * [[https://github.com/VincentGarreau/particles.js/archive/master.zip|]]
+  * {{ :software:development:demo:cms:ucms:application_template:particles.js-master.zip |}}