Skip to content

Suggestion to Add New Features for Scroll-based, 3D, and Mouse Interactions Animations #1851

@alighasemi889

Description

@alighasemi889

Is your feature request related to a problem? Please describe.

Currently, animations in animate.css trigger automatically based on time. I suggest adding the ability to trigger animations only when the user scrolls to a specific section of the page. This feature would be especially useful for creating more engaging, interactive user experiences on long pages or specific sections.

Suggestion: Implement features that trigger animations based on the user's scroll position.

Describe the solution you'd like.

  1. Scroll-based Animations
  2. Support for 3D Animations
  3. Mouse and Touch-based Animations
  4. Chaining Animations

Describe alternatives you've considered.

  1. Scroll-based Animations
  2. Support for 3D Animations
  3. Mouse and Touch-based Animations
  4. Chaining Animations

Additional Context

Hello animate.css team,

I’ve been using your library and I really love the simple and efficient animations you provide. However, I have a few suggestions that could improve the library and make it even more attractive and useful.

Currently, animations in animate.css trigger automatically based on time. I suggest adding the ability to trigger animations only when the user scrolls to a specific section of the page. This feature would be especially useful for creating more engaging, interactive user experiences on long pages or specific sections.

Suggestion: Implement features that trigger animations based on the user's scroll position.

The library primarily focuses on 2D animations, but for more complex projects, 3D animations can be extremely helpful. I suggest adding effects like rotateX, rotateY, and perspective to support 3D animations.

Suggestion: Add support for 3D animations to provide more depth and engaging effects in user interactions.

To enhance interactivity, adding mouse or touch-based animations would be beneficial. This feature would allow users to see animations dynamically based on mouse movements or touches.

Suggestion: Add support for triggering animations when the mouse or finger is hovering over or moving on an element.

Currently, animations run independently. I suggest adding the ability to chain multiple animations so they can play consecutively or simultaneously. This would allow more complex animation sequences.

Suggestion: Implement a chaining feature that allows users to combine multiple animations to run in sequence or at the same time.

These features could make animate.css a much more powerful and flexible tool for a wider range of projects.

Thanks for the amazing library you’ve created! I hope these suggestions can help improve it even further.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions