Великий и ужасный wow.js

@pavel666228 · Регистрация: 17.12.2016

Студворк — интернет-сервис помощи студентам

Добрый день возникла вот такая вот ситуация,

Установил я значит wow.js, animation.css

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
   
          $(document).ready(function() {
              var  div_one = $('.container-flex.padding-100.a');
              div_one.addClass('slideInLeft animated wow');
              div_one.attr("data-wow-offset","150");
              var  div_two = $(".container-flex.margin-15-top-2");
              div_two.addClass('slideInRight animated wow');
              div_two.attr("data-wow-offset","250");
              var host=$(".card");
              host.addClass("zoomIn animated wow");
              host.attr("data-wow-offset","450");
 
          })

JavaScript
1
2
  
          new WOW().init();

Анимации отрабатывают, но отрабатывают сразу же при загрузке страницы и не работает дата атрибуты wow-offset. ( data-wow-offset — расстояние в пикселях от нижнего края браузера до верхней границы элемента необходимое для начала анимации; )

В чем проблема ?)

@pvzh · 05.12.2018, 00:13

Что если сначала data задать, а потом класс добавить? И data-атрибут задавать через data(name, value)? И заодно можно записать покороче, без переменных даже:

JavaScript
1
2
3
4
5
$(document).ready(function () {
    $('.container-flex.padding-100.a')
        .data('wow-offset', 150)
        .addClass('slideInLeft animated wow');
. . .

@pavel666228 · 05.12.2018, 21:10 **[ТС]**

pvzh, можно и так, но я решил уже по другому чуть-чуть... Загнал все дивы с страницы в массив и выбрал из массива нужные.
А и собственно убрал из функции( .ready(function () { ..... } ) все это дело которая сразу же загружала получается скрипт.

JavaScript
1
2
3
4
5
6
7
8
9
10
11
var s = $('div');
 
              s[21].classList.add('slideInLeft', 'animated','wow');
              s[21].setAttribute('data-wow-offset','100');
 
var c = $('.card');
              for (var i=0;i<=3;i++)
              {
                  c[i].classList.add('zoomIn', 'animated','wow');
                  c[i].setAttribute('data-wow-offset','100');
              }

Новые блоги и статьи Все статьи Все блоги /
Вывод данных через динамический список в справочнике Maks 01.04.2026 Реализация из решения ниже выполнена на примере нетипового справочника "Спецтехника" разработанного в конфигурации КА2. Задача: вывести данные из ТЧ нетипового документа. . .	Функция заполнения текстового поля в реквизите формы документа Maks 01.04.2026 Алгоритм из решения ниже реализован на нетиповом документе "ВыдачаОборудованияНаСпецтехнику" разработанного в конфигурации КА2, в дополнении к предыдущему решению. На форме документа создается. . .	К слову об оптимизации kumehtar 01.04.2026 Вспоминаю начало 2000-х, университет, когда я писал на Delphi. Тогда среди программистов на форумах активно обсуждали аккуратную работу с памятью: нужно было следить за переменными, вовремя. . .	Идея фильтра интернета (сервер = слой+фильтр). Hrethgir 31.03.2026 Суть идеи заключается в том, чтобы запустить свой сервер, о чём я если честно мечтал давно и давно приобрёл книгу как это сделать. Но не было причин его запускать. Очумелые учёные напечатали на. . .
Модель здравосоХранения 6. ESG-повестка и устойчивое развитие; углублённый анализ кадрового бренда anaschu 31.03.2026 В прикрепленном документе раздумья о том, как можно поменять модель в будущем	10 пpимет, которые всегда сбываются Maks 31.03.2026 1. Чтобы, наконец, пришла маршрутка, надо закурить. Если сигарета последняя, маршрутка придет еще до второй затяжки даже вопреки расписанию. 2. Нaдоели зима и снег? Не надо переезжать. Достаточно. . .	Перемещение выделенных строк ТЧ из одного документа в другой Maks 31.03.2026 Реализация из решения ниже выполнена на примере нетипового документа "ВыдачаОборудованияНаСпецтехнику" с единственной табличной частью "ОборудованиеИКомплектующие" разработанного в конфигурации КА2. . . .	Functional First Web Framework Suave DevAlt 30.03.2026 Sauve. IO Апнулись до NET10. Из зависимостей один пакет, работает одинаково хорошо как в режиме проекта так и в интерактивном режиме. из сложностей - чисто функциональный подход. Решил. . .