Example
Slider
In this example, I used various effects to dynamically modify an image using a slider. In addition to a classic before-and-after slider, there are variations with a crossfade, a blur effect, and a circular reveal from the center.
All effects are responsive and adapt smoothly to different screen sizes. Images can easily be replaced using the "Replace Image" function.
For effects that use two overlapping images, it’s important to ensure that both images are exactly the same size.
2 Replies
Before-after sliders are one of my favorites. Which one did you use, SaschaFluri?
Hi David,
I wasn’t able to directly manipulate individual images using my JavaScript code. To work around this issue, I grouped the image with a small invisible shape. This allowed me to modify various parameters with JavaScript.
Getting Started with the E-Learning Challenges
Find practical answers to common questions about the E-Learning Challenges, a weekly event that helps you build skills, create your portfolio, and grow as an e-learning professional.