Библиотека AOS (анимация при прокрутке) не работает при выборе элементов для анимации с помощью jQuery
Я пытаюсь анимировать элементы H1 для многих страниц с помощью AOS (анимация при прокрутке). У меня есть несколько страниц, которые используют заголовок, поэтому я выбираю все заголовки с помощью jQuery. Если я вписываю атрибуты вручную в каждом заголовке, это работает, но не при добавлении их через jQuery. Я выбрал другие элементы с помощью jQuery, чтобы оживить их, и они работают. Плитка находится в самом верху каждой страницы. Спасибо!
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<h1 class="title"> </h1>
$(document).ready(function () {
$('.title').attr({
"data-aos": "zoom-in",
"data-aos-duration": "2000"
});
AOS.init();
});
//refresh animations
$(window).on('load', function() {
AOS.refresh();
});
0 ответов
<link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<h1 class="title"> </h1>
$(document).ready(function () {
$('.title').attr({
"data-aos": "zoom-in",
"data-aos-duration": "2000"
});
setTimeout(() => {
AOS.init();
}, 120);
});
Вы должны добавить это в заголовок:
<script type="text/javascript">jQuery(document).ready(function($){$(function() { AOS.init(); }); }); </script>