Unmove
CSS Animation Library
Installation
Add CDN to head
of HTML document: https://cdn.jsdelivr.net/gh/sieis/unmove@main/dist/unmove.css
Spinner Animation
An infinite spin. Add the class um-spin
to anything you want to spin
Crank up the speed. Add the class um-spin-fast
to go twice as fast.
Chill out. Add the class um-spin-slow
to calm down and go real slow.
Ticker Animation
A horizontal news ticker scrolling animation. Add the class um-news-wrap
to a div. This will go around the news ticker area and sets overflow to hiddent.
Add the class um-news-tick
to a div within um-news-wrap
.
Then add the class um-news-item
to each item you want to be in the news ticker.
Currently works best with 7 items because of the spacing used for and between items to create seemless infinite scroll. Also include a duplicate copy of the imgs directly following the initial 7 in order for there to be no breaks in the imgs as they scroll.
If you don't want the scrolling to stop when you hover over an item, add no-hover
. And add reverse to have it scroll from left to right: um-news-tick-reverse-no-hover
Open-source on GitHub