EverWeb Widgets HTML5

Spinning Image Hyperlink

Spinning Image Animation

Forward/Backward Spin

The widget creates a continuously spinning image which stops on hover. The spin direction can be clockwise or anti clockwise and the image can be a hyperlink. The hyperlink can be set to open in a new window if required.
The example below has two images - one set on top of the other. The larger one is set to run clockwise and the smaller one - which forms the hub - runs in the reverse direction..
Either image can be stopped by hovering it. Each one is set as a hyperlink - one to open in a new window and the other in the same window..
The duration is in seconds and is the time for one revolution. The larger the value for duration - the slower the speed. The actual speed is also related to the image size.

clockwise spin
anti-clockwise spinning image animation

Forward/Backward Spin

The widget settings are self explanatory apart from the Radius control. This adds a border radius which is expressed as a percentage rather a fixed number of pixels.
Sliding it fully to the right adds a 50% border radius to the image. This will convert a square image to round and a rectangular one to an oval. Amounts less than 50% will round the image corners to a greater or lesser degree.
If the image being used is round in the first place the Radius control can be left at zero.

Widget Settings

Animate Imaget On Hover Widget
Spinning Image Link
Get The Widget