unordered list animated circle with jQuery

jQuery plugin (2KB) that allows you to create an unordered list as an animated circle.

Changelog:

fixes for hover event, added direction option (clockwise or counter-clockwise)

added hover trigger

 

 

 

fixes for click event

$('.blocks').mobilyblocks({
trigger: 'click', // click or hover
direction: 'clockwise', // clockwise or counter
duration: 500, // duration of animation
zIndex: 50, // z-index value of 'li' elements
widthMultiplier: 1.15
});

HTML

  • ..
  • ..
  • ..

         

 

CSS

.blocks {
display:block;
width:;
height:; /* you need to specify width and height values */
position:relative;
cursor:pointer;
}

ul.reset,
ul.reset li {
display:block;
list-style:none;
padding:0;
margin:0;
}

ul.reset li {
position:absolute;
}

Download: http://www.htmldrive.net/items/download/831

Be Sociable, Share!

Leave a comment