| 1234567891011121314151617181920212223242526272829303132333435 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="utf-8">
- <title>AOS - Animate on scroll library</title>
- <meta name="viewport" content="width=device-width">
- <link rel="stylesheet" href="css/styles.css" />
- <link rel="stylesheet" href="../dist/aos.css" />
- </head>
- <body>
- <div id="aos-demo" class="aos-all"></div>
- <script src="../dist/aos.js"></script>
- <script>
- AOS.init({
- easing: 'ease-in-out-sine'
- });
- setInterval(addItem, 300);
- var itemsCounter = 1;
- var container = document.getElementById('aos-demo');
- function addItem () {
- if (itemsCounter > 42) return;
- var item = document.createElement('div');
- item.classList.add('aos-item');
- item.setAttribute('data-aos', 'fade-up');
- item.innerHTML = '<div class="aos-item__inner"><h3>' + itemsCounter + '</h3></div>';
- container.appendChild(item);
- itemsCounter++;
- }
- </script>
- </body>
- </html>
|
