Cool menu-jquery Wheel Ring Menu Plugin 5 effects Demo
Online preview
Instance Code
1234567891011121314151617181920212223242526272829303132333435 |
<div
class
=
"container"
>
<!-- Top Navi -->
<div
class
=
"header"
>
</div>
<div
class
=
"menu"
>
<a
class
=
"active"
href=
"index.html"
>Demo 1</a>
<a href=
"index2.html"
>Demo 2</a>
<a href=
"index3.html"
>Demo 3</a>
<a href=
"index4.html"
>Demo 4</a>
<a href=
"index5.html"
>Demo 5</a>
</div>
<div
class
=
"main"
>
<a href=
"#wheel"
class
=
"wheel-button"
>
<i
class
=
"customicon-plus"
></i>
</a>
<div
class
=
"pointer"
>Click me</div>
<ul id=
"wheel"
>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-home"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-music"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-video"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-heart"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-user"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-trash"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-envelope"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-camera"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-picture"
></i></a></li>
<li
class
=
"item"
><a href=
"#home"
><i
class
=
"customicon-eye-open"
></i></a></li>
</ul>
</div>
</div><!-- Container -->
<script type=
"text/javascript"
>
$(
".wheel-button"
).wheelmenu();
</script> Reprint: http://www.cnblogs.com/niuboren/p/6120540.html
|
JQuery Wheel Ring Menu Plugin 5 effects Demo