时隐时现的导航菜单脚本 dn001 2009-06-21 08:18:20 <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <meta http-equiv="Content-Language" content="zh-cn" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <title>佳能(中国)</title> <script type="text/JavaScript"> activateMenu = function(nav) { /* currentStyle restricts the Javascript to IE only */ if (document.all && document.getElementById(nav).currentStyle) { var navroot = document.getElementById(nav); /* Get all the list items within the menu */ var lis=navroot.getElementsByTagName("LI"); for (i=0; i<lis.length; i++) { /* If the LI has another menu level */ if(lis[i].lastChild.tagName=="UL"){ /* assign the function to the LI */ lis[i].onmouseover=function() { /* display the inner menu */ this.lastChild.style.display="block"; } lis[i].onmouseout=function() { this.lastChild.style.display="none"; } } } } } window.onload= function(){ /* pass the function the id of the top level UL */ /* remove one, when only using one menu */ activateMenu('nav'); // activateMenu('vertnav'); } function MM_jumpMenu(targ,selObj,restore){ //v3.0 eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'"); if (restore) selObj.selectedIndex=0; } </script> <style type="text/css"> <!-- #nav{ list-style: none; margin-top:-5px !important; margin-top:0px; } #nav ul { padding: 0; margin:0; list-style: none; z-index:99; position:relative; overflow:visible; } #nav li { margin:0; position: relative; float:left; display:block; height:auto; background-image: url(//www.canon.com.cn/images/hollow.gif); } #nav ul a { text-decoration:none; display:block; line-height:1.5em; text-indent:0.5em; font-size: 12px; background-color: #ffffff; /*border-right: 1px solid #c50000; border-bottom: 1px solid #c50000; border-left: 1px solid #c50000;*/ color: #666666; border-right: 1px solid #dedede; border-bottom: 1px solid #dedede; border-left: 1px solid #dedede; } #nav ul a:hover { background-color: #c50000; background-color: #dedede; color: #ffffff; } #nav a:hover, #nav li:hover{ } #nav ul li:hover, #nav ul li a:hover { } #nav ul{ display:none; } /*all see this */ #nav ul, #nav ul ul{ display:none; position:absolute; left: 30px; } #nav ul { left: 22px; } #nav ul ul { left: 91px; } /* non-IE browsers see this */ #nav ul li>ul, #nav ul ul li>ul{ margin-top:-1.4em; } #nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul, #nav li:hover ul ul ul ul ul{ display:none; } #nav li:hover ul, #nav ul li:hover ul, #nav ul ul li:hover ul, #nav ul ul ul li:hover ul, #nav ul ul ul ul li:hover ul{ display:block; } li>ul { top: auto; left: auto; } /* 一级栏目 */ #nav a.nav_product, #nav a.nav_event, #nav a.nav_support, #nav a.nav_service, #nav a.nav_club, #nav a.nav_canon { background-image:url(//www.canon.com.cn/front/images/nav_prd.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_prd.png); cursor:hand; background-repeat: no-repeat; display: block; line-height: 31px; width: 64px; height:30px; text-indent: -20000px; border: none; margin-left: 30px; } #nav a.nav_event { background-image:url(//www.canon.com.cn/front/images/nav_event.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_event.png); width:64px; } #nav a.nav_support { background-image:url(//www.canon.com.cn/front/images/nav_sp.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_sp.png); } #nav a.nav_service { background-image:url(//www.canon.com.cn/front/images/nav_srv.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_srv.png); } #nav a.nav_club { background-image:url(//www.canon.com.cn/front/images/nav_club.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_club.png); width:64px; } #nav a.nav_canon { background-image:url(//www.canon.com.cn/front/images/nav_canon.png) !important; background-image:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=//www.canon.com.cn/front/images/nav_canon.png); } a.cmenu { background-image: url(../images/cmenu_hover.gif); background-repeat: no-repeat; background-position: right center; } ul#nav ul { width: 90px; } ul#nav ul ul { margin-top: -1px; } ul#nav ul li a { width: 90px; } ul#nav ul { border-top-width: 1px; border-top-style: solid; /*border-top-color: #ffffff;margin-top: -1px;*/ border-top-color: #c50000; z-index: 200; } ul#nav ul ul { top: 0px; border-top-width: 1px; border-top-style: solid; /*border-top-color: #c50000;*/ border-top-color: #dedede; } ul#nav ul ul li a { width: 150px; } ul#nav ul#sm_prd ul li a { width: 140px; } ul#nav ul#sm_sp ul li a, ul#nav ul#sm_club ul li a { width: 90px; } ul#nav ul#sm_club a { width: 105px; } ul#nav ul#sm_club ul { left: 106px; } ul#nav ul#sm_canon { left: 5px; } ul#nav ul#sm_canon ul li a { width: 80px; } ul#nav ul#sm_canon ul { left: -81px; } ul#sm_prd ul.ntb, ul#sm_sp ul.ntb, ul#sm_srv ul.ntb, ul#sm_club ul.ntb, ul#sm_canon ul.ntb { border-top-style: none; margin-top: 1px; } ul#sm_prd ul.supply { margin-top: -190px; } --> </style> </head> <body> <div id="sitenav"> <ul id="nav"> <li> <a href="/front/product/cat0.html" class="nav_product">产品天地</a> <ul id="sm_prd"> <li><a href="#" class="cmenu">照相机</a> <ul class="ntb"> <li><a href="/front/product/cat19.html">EOS胶片单反相机</a> </li> <li><a href="/front/product/cat20.html">EOS数码单反相机</a> </li> <li><a href="/front/product/cat71.html">PowerShot数码相机</a> </li> <li><a href="/front/product/cat21.html">IXUS数码相机</a> </li> <li><a href="/front/product/cat22.html">PRIMA小霹雳</a></li> <li><a href="/front/product/cat24.html">EF系列镜头</a> </li> </ul> </li> <li><a href="#" class="cmenu">数码摄像机</a> <ul> <li><a href="/front/product/cat117.html">DVD摄像机</a></li> <li><a href="/front/product/cat72.html">普及型数码摄像机</a></li> <li><a href="/front/product/cat81.html">专业级数码摄像机</a></li> <li><a href="/front/product/cat118.html">专业级高清摄像机</a></li> </ul> </li> <li><a href="#" class="cmenu">打印机</a> <ul> <li><a href="/front/product/cat39.html">PIXMA喷墨照片打印机</a> </li> <li><a href="/front/product/cat35.html">PIXMA多功能数码打印机</a></li> <li><a href="/front/product/cat36.html">LASERSHOT激光打印机</a> </li> <li><a href="/front/product/cat37.html">Selphy直接照片打印机</a> </li> <li><a href="/front/product/cat38.html">商用彩色喷墨打印机</a> </li> </ul> </li> <li><a href="#" class="cmenu">扫描仪</a> <ul> <li><a href="/front/product/cat42.html">时尚照片扫描仪</a> </li> <li><a href="/front/product/cat43.html">专业影像扫描仪</a> </li> <li><a href="/front/product/cat44.html">专业高速文件扫描仪</a> </li> </ul> </li> <li><a href="#" class="cmenu">一体机</a> <ul> <li><a href="/front/product/cat49.html">激光多功能一体机</a> </li> <li><a href="/front/product/cat106.html">PIXMA多功能数码打印机</a> </li> </ul> </li> <li><a href="#" class="cmenu">传真机</a> <ul> <li><a href="/front/product/cat51.html">喷墨普通纸传真机</a> </li> <li><a href="/front/product/cat50.html">色带普通纸传真机</a> </li> <li><a href="/front/product/cat52.html">激光普通纸传真机</a></li> </ul> </li> <li><a href="#" class="cmenu">专业打印设备</a> <ul> <li><a href="/front/product/cat54.html">卡片打印机</a> </li> <li><a href="/front/product/cat55.html">大幅面打印机</a> </li> </ul> </li> <li><a href="/front/product/cat53.html">小型复印机</a></li> <li><a href="#" class="cmenu">复合机</a> <ul> <li><a href="/front/product/cat47.html">彩色数码复合机</a> </li> <li><a href="/front/product/cat48.html">黑白数码复合机</a> </li> </ul> </li> <li><a href="/front/product/cat45.html">投影仪</a></li> <li><a href="/front/product/cat46.html">望远镜</a></li> <li><a href="//consumable.canon.com.cn/" target="_blank">耗材</a> </li> <li><a href="/front/product/fitting.jsp?accessoryClass=1">可选附件</a></li> </ul> </li> <li><a href="/front/marketing/index.jsp" class="nav_event">市场活动</a> </li> <li><a href="/front/support/index.jsp" class="nav_support">购买支持</a> <ul id="sm_sp"> <li><a href="/front/support/guide/index.jsp">购买指南</a></li> <li><a href="/front/support/sale/index.jsp">营销网络</a></li> <li><a href="/front/support/majorclients/index.jsp" class="cmenu">大客户采购</a> <ul> <li><a href="/front/support/majorclients/index.jsp">大客户部</a></li> <li><a href="/front/support/majorclients/solutions/email.jsp">产品&解决方案</a></li> <li><a href="/front/support/majorclients/consulting/content.jsp">采购咨询</a></li> <li><a href="/front/support/majorclients/contact.jsp">联系我们</a></li> </ul> </li> <li><a href="/front/support/gov/index.jsp" class="cmenu">政府采购</a> <ul> <li><a href="/front/support/gov/index.jsp">预约采购</a></li> <li><a href="/front/support/gov/casestudy.jsp">成功案例</a></li> <li><a href="/front/support/gov/reference.jsp">政府采购参考</a></li> <li><a href="/front/support/gov/contact.jsp">联系我们</a></li> </ul> </li> </ul> </li> <li><a href="/front/service/index.jsp" class="nav_service">售后服务</a> <ul id="sm_srv"> <li><a href="/front/service/announce/index.jsp">最新公告</a></li> <li><a href="/front/service/download/index.jsp">下载中心</a></li> <li><a href="/front/service/policy/index.jsp">服务政策</a></li> <li><a href="/front/service/authenticity.jsp">防伪查询</a></li> <li><a href="/front/service/faq/index.jsp">常见问题</a></li> <li><a href="/front/service/fastrepair/index.jsp">快修中心</a></li> <li><a href="/front/service/repair/index.jsp">维修网络</a></li> <li><a href="/front/service/troubleshoot/index.jsp">故障排除</a></li> <li><a href="/front/service/feedback/index.jsp">用户反馈</a></li> </ul> </li> <li><a href="/front/club/index.jsp" class="nav_club">影像乐园</a> <ul id="sm_club"> <li><a href="/front/club/vshow/index.jsp" class="cmenu">佳能展厅</a> <ul class="ntb"> <li><a href="/front/club/vshow/index.jsp">北京展厅</a></li> <li><a href="/front/club/vshow/gz.jsp">广州展厅</a></li> </ul> </li> <li><a href="/front/club/digispace/alive.jsp" class="cmenu">数码课堂</a> <ul> <li><a href="/front/club/digispace/alive.jsp">课程表</a></li> <li><a href="/front/club/digispace/elite.jsp">精选精讲</a></li> <li><a href="/front/club/digispace/online.jsp">在线视听</a></li> <li><a href="/front/club/digispace/training.jsp">EOS数码相机<br /> 用户培训</a></li> </ul> </li> <li><a href="/front/club/activity/index.jsp" class="cmenu">活动天地</a> <ul> <li><a href="/front/club/activity/index.jsp">活动看板</a></li> <li><a href="/front/club/activity/index.jsp">精彩活动回顾</a></li> </ul> </li> <li><a href="/front/club/download/desktop.jsp" class="cmenu">超级下载</a> <ul> <li><a href="/front/club/download/desktop.jsp">屏保壁纸</a></li> <li><a href="/front/club/download/sample.jsp">样张下载</a></li> <li><a href="/front/club/download/ad.jsp">广告下载</a></li> <li><a href="/front/club/download/game.jsp">游戏下载</a></li> <li><a href="/card/index.jsp">贺卡下载</a></li> </ul> </li> <li><a href="/front/club/zine/index.jsp">在线杂志</a></li> <li><a href="/front/club/member/index.jsp">会员专区</a> </li> <li><a href="/consumable/index.jsp">耗材积分</a> </li> <li><a href="//www.canon.com.cn/canonbaseball/" target="_blank">佳能棒球馆</a></li> <li><a href="//www.canon.com.cn/tennis/" target="_blank">佳能与莎拉波娃</a></li> <li><a href="//www.canon.com.cn/csl/" target="_blank">佳能与中超</a></li> </ul> </li> <li><a href="/front/canon/index.jsp" class="nav_canon">关于佳能</a> <ul id="sm_canon"> <li><a href="/front/canon/group/index.jsp" class="cmenu">佳能集团</a> <ul class="ntb"> <li><a href="/front/canon/group/index.jsp">集团介绍</a></li> <li><a href="/front/canon/group/faith.jsp">企业理念</a></li> <li><a href="/front/canon/group/stratage.jsp">发展战略</a></li> <li><a href="/front/canon/group/event.jsp">发展历程</a></li> </ul> </li> <li><a href="/front/canon/inchina/intro.jsp" class="cmenu">佳能在中国</a> <ul> <li><a href="/front/canon/inchina/intro.jsp">公司介绍</a></li> <li><a href="/front/canon/inchina/leader.jsp">总裁致辞</a></li> <li><a href="/front/canon/inchina/organize.jsp">在华布局</a></li> <li><a href="/front/canon/inchina/event.jsp">发展历程</a></li> </ul> </li> <li><a href="/front/canon/news/news_list.jsp">佳能新闻</a></li> <li><a href="/front/canon/news/news_list.jsp?news_type=2">公司荣誉</a></li> <li><a href="/front/canon/tech/index.jsp">领先科技</a></li> <li><a href="/front/canon/environment/index.jsp">环保事业</a></li> <li><a href="/front/canon/devote/index.jsp">公益活动</a></li> </ul> </li> </ul> </div> </body> </html>