Blog Post
AdamZamczyk
Community Member
This week, I've taken on a challenge centred around tab interaction, and I'm excited to share my example with you: https://tab.zamczyk.co.uk/.
The core of this short demo is to present seamless tab interaction featuring elegant and smooth animations when selecting from three tabs. Here, I use the default Storyline animations.
I'm still on a long journey to learn JavaScript and explore diverse custom techniques to elevate the user experience. I've incorporated a variety of animations and custom zoom effects activated by JavaScript triggers.
First Tab: Here, you'll find a single flip card animation that comes alive with a zoom effect as you hover your mouse over the cards.
Second Tab: This section lets you see a dynamic zoom image effect triggered by mouse hover. This custom JavaScript zoom effect keeps the original image dimensions and offers a tailored experience with adjustable speed, ease, and timing.
Third Tab: This tab showcases the same zoom effect (JavaScript), but it is controlled by scrolling your mouse wheel.
Dive into the demo and see for yourself!
The core of this short demo is to present seamless tab interaction featuring elegant and smooth animations when selecting from three tabs. Here, I use the default Storyline animations.
I'm still on a long journey to learn JavaScript and explore diverse custom techniques to elevate the user experience. I've incorporated a variety of animations and custom zoom effects activated by JavaScript triggers.
First Tab: Here, you'll find a single flip card animation that comes alive with a zoom effect as you hover your mouse over the cards.
Second Tab: This section lets you see a dynamic zoom image effect triggered by mouse hover. This custom JavaScript zoom effect keeps the original image dimensions and offers a tailored experience with adjustable speed, ease, and timing.
Third Tab: This tab showcases the same zoom effect (JavaScript), but it is controlled by scrolling your mouse wheel.
Dive into the demo and see for yourself!
JeffreyRiley-9e
8 months agoCommunity Member
Adam this worked well and it does look great. My vision though is not that great so I could not read most of your text. Could you make the font larger and make sure the white text has more contrast behind it.
The javascript effects are visually exciting and makes it easy to view the images. Nice job.
The javascript effects are visually exciting and makes it easy to view the images. Nice job.