人人IT網

人人IT網

當前位置: 主頁 > JAVA編程 > JAVA >

jQuery Wheel 環形菜單插件5種效果演示

時間:2016-12-01 12:14來源:Internet 作者:Internet 點擊:
很酷的菜單-jQuery Wheel 環形菜單插件5種效果演示 在線預覽 下載地址 實例代碼 <div class="container"> <!-- To

很酷的菜單-jQuery Wheel 環形菜單插件5種效果演示

 在線預覽

下載地址

實例代碼

 <div class="container">
            <!-- Top Navi -->
            <div class="header">
                <h1>jQuery Wheel 環形菜單插件 Demo 1: Default Settings</h1>	
            </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>

 


From:ITEYE
頂一下
(0)
0%
踩一下
(0)
0%
------分隔線----------------------------
發表評論
請自覺遵守互聯網相關的政策法規,嚴禁發布色情、暴力、反動的言論。
評價:
表情:
驗證碼:點擊我更換圖片
欄目列表
推薦內容