Ready Developed exclusively for Shopware 6
WEBSE AnimateScroll Plugin

WEBSE AnimateScroll Plugin

Source Available
7 Downloads
Responsive
    webse74486150662
  • 1.0.2
  • 30 Jan 2020
  • de_DE en_GB
  • from Christian Kilian
  • 6.0.0
    6.1.0 – 6.1.3
With this plugin it is possible to implement animation effects when scrolling the page. There... more

Product information

With this plugin it is possible to implement animation effects when scrolling the page. There are many libraries that make this task easier for us. AOS, also known as animate on scroll, is one such library that does exactly what the name implies: you can apply different types of animations to elements as they scroll in the view.

This is how AOS works: Actually, the idea behind AOS is simple. All elements and their positions are monitored on the website. For the animation then only the CSS class is added or removed. In addition, AOS brings a number of different animations that are already out-of-the-box available. But even new animations can be easily created - without having to worry about the duration or delay.


So AOS is built into the experience world: Enter a desired animation in the CSS class the respective experience world element:


Fade animations:

  • bland
  • fade-up
  • fade-down
  • fade-left
  • fade-right
  • fade-up right
  • fade-up left
  • fade-down-right
  • fade-down-left


Flip animations:

  • flip-up
  • flip-down
  • flip-left
  • flip-right


Zoom animations:

  • zoom-in
  • zoom-in up
  • zoom-in-down
  • zoom-in left
  • zoom-in right
  • zoom-out
  • zoom-out-up
  • zoom-out down
  • zoom-out left
  • zoom-out right

Show full description

Features

  • Once: This attribute specifies whether the animation should be repeated when the page is scrolled repeatedly
  • Duration: This attribute specifies at which rate 50 to 3000 ms (step 50, 100, 150, ...) the animation is accelerated or slowed down
  • Delay: This attribute specifies when an animation should start delayed 50 to 3000 ms (step 50, 100, 150, ...)
  • Offset: This attribute will cause the animation to fire sooner or later than the set time (default value is 120 pixels)
  • Easing: This attribute provides a soft start, acceleration and lapse of the animation
Read, write and discuss reviews... more

Customer reviews

Installation manual

  • Installation takes place via the administration interface
  • Upload the plugin to the plugin manager "My Plugins": Settings> System> Plugins -> Upload Plugin button
  • Now the plugin "Webse AnimateScroll Plugin" should appear in the plugin manager
  • Now click with the mouse on the three points and install the plugin
  • After successful installation wait about 5 seconds and then activate the plugin
  • After the plugin has been successfully installed and activated
  • ... click on the three dots again and open the configuration
  • ... switch to the sales channels> Theme -> Theme Assignment> Edit Theme button


So AOS is built into the experience world: Enter a desired animation in the CSS class the respective experience world element:


Fade animations

  • fade-up
  • fade-down
  • fade-left
  • fade-right
  • fade-up right
  • fade-up left
  • fade-down-right
  • fade-down-left


Flip animations

  • flip-up
  • flip-down
  • flip-left
  • flip-right


Zoom animations

  • zoom-in
  • zoom-in up
  • zoom-in-down
  • zoom-in left
  • zoom-in right
  • zoom-out
  • zoom-out-up
  • zoom-out down
  • zoom-out left
  • zoom-out right

Changelog

Version 1.0.2

# 1.0.2

- Plugins have been revised and the structure changed.

- Update instructions:

- 1. Deactivate and uninstall the plugin

- Import update 1.0.2

- 3. Reinstall and activate the plugin

Version 1.0.1

# 1.0.1

- Compatible with Shopware v6.1.0 RC3.

- Update instructions:

- 1. Deactivate and uninstall the plugin

- Import update 1.0.1

- 3. Reinstall and activate the plugin

Version 1.0.0

# 1.0.0

- First published in the Community Store

About the manufacturer

Christian Kilian Christian Kilian 20 Extensions 3.5 Ø Rating

Recently viewed