Mirroring Effect on Text.

How to add mirroring animation over text <script src=”https://unpkg.com/scroll-out/dist/scroll-out.min.js”> </script> <script src=”https://unpkg.com/splitting/dist/splitting.js”> </script> <span id=”jjrd-head-text” class=”text text–turning” data-scroll=”out” data-splitting=””>ERP + eCommerce</span> /* transform */ .jjrd-benefits .text .char { display:inline-flex; -webkit-animation-delay: calc(0.25s + var(–char-index) * 0.1s); animation-delay: calc(0.25s + var(–char-index) * 0.1s); transition: all 0.25s calc(0.25s + var(–char-index) * 0.1s); }. .jjrd-benefits .text–turning [data-scroll=’out’] .char {… Continue reading Mirroring Effect on Text.

Published
Categorized as Magento

how to add Lottie animation video to a div using javascript

To add a Lottie animation to a div using JavaScript, you can follow these steps: First, include the Lottie library in your HTML file by adding the following script tag in the head section:<head> <script src=”https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.5.9/lottie.min.js”></script> </head> Next, create a container div in your HTML file where the Lottie animation will be loaded. For example:<div… Continue reading how to add Lottie animation video to a div using javascript

Published
Categorized as Magento

how to load Lottie animation on hover using javascript

To load a Lottie animation on hover using JavaScript, we can use these steps: First, you need to include the Lottie library in your HTML file. You can do this by adding the following script tag in the head section of your HTML file: <head> <script src=”https://cdnjs.cloudflare.com/ajax/libs/bodymovin/5.5.9/lottie.min.js”></script> </head> 2. Next, you need to create a… Continue reading how to load Lottie animation on hover using javascript

Published
Categorized as Magento