Эффект "Шум" для сайта

НА ВСЮ ДЛИНУ СТРАНИЦУ:

<style>
.bg .tn-atom {
    background-size: auto !important;
    background-repeat: repeat !important;
    pointer-events: none;
}
.bg {
    pointer-events: none;
    z-index: 99999999 !important;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw !important;
    height: 100vh !important;
}
</style>

НА ОДИН БЛОК:

<style>
.bg .tn-atom {
    background-size: auto !important;
    background-repeat: repeat !important;
    pointer-events: none;
}
.bg {
    pointer-events: none;
}
</style>

Применение:

Добавить на#nbsp;страницу Zero-блок необходимой высоты.
Добавить в#nbsp;зеро Shape со#nbsp;следующими настройками#nbsp;— window container, height 100%, width 100%, opacity 5%-30%, задаем класс (css class name) bg.
В#nbsp;шейп (shape) вставляем картинку noise.gif, предварительно сохранив ее#nbsp;себе на#nbsp;диск.
Добавить на#nbsp;страницу блок Т123 (html)
В#nbsp;блок html записываем скрипт стилей CSS для зеро-блока, приведенный ниже.
В#nbsp;скрипте ничего не#nbsp;меняем, если задали класс шейпа .bg, а#nbsp;если дали свое название классу, то#nbsp;заменяем .bg#nbsp;на#nbsp;своё наименование в#nbsp;двух местах.

noise.gif

Благодарим за скрипт Тильдошную - https://tildoshnaya.com/modification/pattern

2022-03-30 01:07 Эффекты и анимация