Questions tagged [aos.js]
AOS - Animate on scroll - JavaScript library
aos.js
64
questions
1
vote
0
answers
21
views
How to use AOS and loadash in the nuxt3.12؟؟
I installed two packages "Nuxt-aos" and "lodash" with pnpm libraries into my project and after that, I added these two to my nuxt.config.ts:
modules: [
"nuxt-aos",
&...
- 116
0
votes
0
answers
27
views
React | aos | node | Unknown file extension ".css" for /home/user/.../aos/dist/aos.css with
I am trying to use aos on a website based on React.
Here is the component I created according to https://getisotope.com/post/react-aos:
//AOSs.tsx
import AOS from "aos";
import "aos/...
- 31
1
vote
0
answers
49
views
AOS CSS animation does not work on scroll
I use the AOS CSS library for scroll animation, but now it works immediately when the page loads. How to fix it?
jQuery(document).ready(function ($) {
//AOS CSS
AOS.init({});
})
<...
- 79
0
votes
0
answers
16
views
How do i solve AOS scroll animation problem?
I have faced one problem several times when i am using scroll animation (aos, tailwind animated) on my react project, the animation won't happen on scroll, it is happening before user comes to the ...
- 1
0
votes
0
answers
64
views
Issue with AOS.js fade in animation when navigating between sections with a navbar
I'm encountering a problem with the AOS.js library when using a navbar to navigate between sections on my webpage. Specifically, when I navigate from section_1 to another section below it, the fade-in ...
1
vote
1
answer
80
views
data binding in AOS - possible?
I'm using Animate On Scroll in my angular poject, I have a bunch of images, that I want to reveal one after the other.
<div class="img-gallery">
<div *ngFor="let ...
- 138
0
votes
0
answers
169
views
Troubleshooting AOS in Next.js 13: Seeking Solutions for Proper Functionality
I have a multiple divs that needs to appear in animated form when it reaches the viewport. It is not like AOS is not working but the div only appear when they reach around the top section or mid ...
-1
votes
3
answers
89
views
How to change animation on screen width threshold
I'm currently using the data-aos attribute to apply the "fade-up-right" animation to an element in my web page, like this:
<div className="des__Container" data-aos="fade-up-...
0
votes
0
answers
60
views
Overflow x appearing when animated (AOS)
How can I get rid of the overflow-x that always appears for the image I put on the top right of my page. I've tried to use "overflow-x-hidden"
I tried to animate the image of a cloud that ...
0
votes
0
answers
168
views
AOS(Animation On Scroll) Library doesn't work with SmoothScrollbar-js
I'm using SmoothScrollbar Library and AOS in my HTML website. But AOS animation is not working. Below is my JS code:
// ====== SMOOTH SCROLL ======
var Scrollbar = window.Scrollbar;
Scrollbar.init(...
- 156
0
votes
0
answers
85
views
How do I stop overflow on my webpage when using AOS library
I added AOS library on this project sushi007.netlify.app and now I have an overflow... How do I stop it the page from overflow?
I tried adding overflow hidden on all the sections. It worked but the ...
0
votes
1
answer
636
views
AOS not triggering animation in view with Astro component
My Astro component triggers AOS (Animate on Scroll) only once and not when in view. Here's my astro component:
---
import { Image } from '@astrojs/image/components';
import CTA from './common/CTA....
- 329
0
votes
1
answer
495
views
AOS.js animation problem hides dropdown in boostrap 5 navbar
I am developing a Drupal website with a nav menu using Bootstrap 5 and one of the requirement was to add some animation.
For the animation I have used AOS.js library and the problem happens after ...
- 156
5
votes
2
answers
2k
views
How to implement scroll-triggered animations in Next.js 13?
I am wondering how to implement scroll-triggered animations in Next.Js 13 properly.
I have tried to use a scroll-triggered animation library like AOS, but in order for it to work, it needs to be ...
- 151
0
votes
1
answer
6k
views
HTML: Make AOS animations play when page is first loaded
I am trying to make AOS flip-up animations start when the page is initially loaded.
I am refering to the animations applied to img items in <div class="social-media"> , i am using the ...
