123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263 |
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
- <title></title>
- <!--框架必需start-->
- <script type="text/javascript" src="../../libs/js/jquery.js"></script>
- <script type="text/javascript" src="../../libs/js/language/cn.js"></script>
- <script type="text/javascript" src="../../libs/js/framework.js"></script>
- <link href="../../libs/css/import_basic.css" rel="stylesheet" type="text/css"/>
- <link rel="stylesheet" type="text/css" id="skin" prePath="../../" scrollerY="false"/>
- <link rel="stylesheet" type="text/css" id="customSkin"/>
- <!--框架必需end-->
- <!--鱼眼菜单start-->
- <script type="text/javascript" src="../../libs/js/nav/fishEye.js"></script>
- <!--鱼眼菜单end-->
- </head>
- <body >
- 应用场景见框架的desktop风格。
- <div class="dock" id="mydock">
- <div class="dock_left"></div>
- <div class="dock_center">
- <div id="dock">
- <div class="dock-container">
- <a class="dock-item" href="javascript:;" title="账户管理" keepDefaultStyle="true"><span>账户管理</span><img src="../../libs/images/stacks/01.png"></a>
- <a class="dock-item" href="javascript:;" title="电子邮件" keepDefaultStyle="true"><span>电子邮件</span><img src="../../libs/images/stacks/02.png"/></a>
- <a class="dock-item" href="javascript:;" title="综合查询" keepDefaultStyle="true"><span>综合查询</span><img src="../../libs/images/stacks/03.png"/></a>
- <a class="dock-item" href="javascript:;" title="系统设置" keepDefaultStyle="true"><span>系统设置</span><img src="../../libs/images/stacks/04.png"/></a>
- </div>
- </div>
-
- </div>
- <div class="dock_right"></div>
- <div class="clear"></div>
- </div>
- <script>
- $(function(){
- //初始化鱼眼菜单
- $('#dock').Fisheye(
- {
- maxWidth: 64,
- items: 'a',
- itemsText: 'span',
- container: '.dock-container',
- itemWidth: 80,
- proximity: 80,
- valign: 'bottom',
- halign : 'center'
- }
- );
-
-
- })
- //当浏览器尺寸变化时重设菜单位置,让菜单始终水平居中
- function customHeightSet(contentHeight){
- $("#mydock").css({
- "left":($("body").width()-700)/2
- })
- }
- </script>
- </body>
- </html>
|