An Interest In:
Web News this Week
- April 19, 2024
- April 18, 2024
- April 17, 2024
- April 16, 2024
- April 15, 2024
- April 14, 2024
- April 13, 2024
Some of Our Sources
- Slashdot
- Techcrunch
- Just Creative
- Pearsonified
- Smashing Magazine
- FanExtra - PSD
- Noupe
- Line 25
- Wal You
- Daily Now
Help Webnuz
Referal links:
April 19, 2024 10:08 am GMT
Original Link: https://dev.to/shhdharmen/animation-can-make-bell-much-more-than-emoji-55op
Animation can make bell much more than emoji!
We all use wave emoji a lot in web apps!
Next time when you use it, try to add a simple wave animation to it...
@keyframes bell-keyframes { 0% { transform: rotate(0deg); } 10% { transform: rotate(14deg); } 20% { transform: rotate(-8deg); } 30% { transform: rotate(14deg); } 40% { transform: rotate(-4deg); } 50% { transform: rotate(10deg); } 60% { transform: rotate(0deg); } 100% { transform: rotate(0deg); }}.bell-animation { animation-duration: 1s; animation-iteration-count: var(--times, 1); animation-name: bell-keyframes; transform-origin: top center;}I have also created a codepen for it:
Original Link: https://dev.to/shhdharmen/animation-can-make-bell-much-more-than-emoji-55op
Share this article:
Tweet
View Full Article
Dev To
An online community for sharing and discovering great ideas, having debates, and making friendsMore About this Source Visit Dev To