网站导航栏下拉菜单偏移问题

问题描述

网站导航栏当电脑分辨率改变时有偏移,这是一个部分的代码,请大家帮忙看看。<DIVclass=menuid=Layer3onmouseover="this.style.visibility=''"style="Z-INDEX:1;LEFT:345px;VISIBILITY:hidden;WIDTH:60px;POSITION:absolute;TOP:139px;HEIGHT:268px"onmouseout="this.style.visibility='hidden'"><TABLEcellSpacing=1cellPadding=0width="100%"border=0><TBODY><TR><TDbgColor=#02602c><TABLEcellSpacing=0cellPadding=0width="100%"border=0><TBODY><TR><TD><IMGheight=5src=""width=1></TD></TR><TR><TDclass=sub_nav_greenonmouseover="this.className='sub_nav_red';this.style.cursor='hand'"onclick="location.href='newslist1.asp'"onmouseout="this.className='sub_nav_green'">&nbsp;-动态</TD></TR><TR><TDclass=nav_grayalign=right><IMGsrc="index/sub_nav_dot.gif"></TD></TR><TR><TDclass=sub_nav_greenonmouseover="this.className='sub_nav_red';this.style.cursor='hand'"onclick="location.href='newslist.asp'"onmouseout="this.className='sub_nav_green'">&nbsp;-新闻</TD></TR><TR><TR><TDclass=nav_grayalign=right><IMGsrc="index/sub_nav_dot.gif"></TD></TR><TR><TDclass=sub_nav_greenonmouseover="this.className='sub_nav_red';this.style.cursor='hand'"onclick="location.href='newslist2.asp'"onmouseout="this.className='sub_nav_green'">&nbsp;-典型</TD></TR><TDclass=nav_grayalign=right><IMGsrc="index/sub_nav_dot.gif"></TD></TR></TABLE></TD></TR></TBODY></TABLE></DIV>

解决方案

解决方案二:
看你那个DIV的样式就知道问题了<DIVclass=menuid=Layer3onmouseover="this.style.visibility=''"style="Z-INDEX:1;LEFT:345px;VISIBILITY:hidden;WIDTH:60px;POSITION:absolute;TOP:139px;HEIGHT:268px"建议用JS获取到客户端的分辨率之后判断topleftright的位置大小

时间: 2025-01-30 07:05:39

网站导航栏下拉菜单偏移问题的相关文章

js 导航栏下拉菜单代码

提示:您可以先修改部分代码再运行 js 导航栏下拉菜单代码 Home Single Level Dropdown Dropdown one Dropdown 1.1 Dropdown 1.2 Dropdown 1.3 Dropdown 1.4 Dropdown 1.5 Dropdown 1.6 Dropdown two Dropdown 2.1 Dropdown 2.2 Dropdown 2.3 Dropdown 2.4 Dropdown 2.5 Dropdown three Dropdown

【前端】导航栏下拉菜单及简单滑动门效果用一句话JS实现

原理:利用隐藏和显示容器的方式来实现.此效果同样适用于导航栏的下拉菜单. 假设有两个div分别为divid1和divid2 第一个div上: onMouseOver="divid1.style.display='block';divid2.style.display='none';'" 第二个div上: onMouseOver="divid2.style.display='block';divid1.style.display='none';'" PS:手动写技术博

纯CSS导航条下拉菜单代码

提示:您可以先修改部分代码再运行 纯CSS导航条下拉菜单代码 Home Single Level Dropdown Dropline Flyout Support Contact 提示:您可以先修改部分代码再运行

jQuery实现的导航下拉菜单效果示例_jquery

本文实例讲述了jQuery实现的导航下拉菜单效果.分享给大家供大家参考,具体如下: <!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"> <h

jQuery实现的简洁下拉菜单导航效果代码_jquery

本文实例讲述了jQuery实现的简洁下拉菜单导航效果.分享给大家供大家参考.具体如下: 这里使用jQuery实现简洁下拉菜单导航效果,代码规范,兼容性方面:支持 IE6+, Firefox 1.5+, Opera 8+, Safari 3+, Chrome 0.2+.简洁明快的jquery网站菜单,请参阅代码. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-simple-down-show-menu-nav-codes/ 具体代码

jquery实现二级导航下拉菜单效果_jquery

下拉菜单实现很简单,纯css也能实现,但是我不擅长,用jquery也就两行代码,于是就用jquery+css实现简单二级下拉菜单导航,分享给大家供大家参考,具体内容如下 运行效果图: 具体代码:第一步:确定导航的html格式 <ul id="nav"> <li><a href="#">首页</a> <ul> <li><a href="#">PHP编程</a&

javascript仿京东导航左侧分类导航下拉菜单效果_javascript技巧

本文实例为大家分享了类似于京东.淘宝商城左侧分类导航下拉菜单,供大家参考,具体内容如下 效果图:   实现代码: <!DOCTYPE html> <html> <head> <meta charset="gb2312"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title></title> &l

jQuery实现的导航下拉菜单效果_jquery

本文实例讲述了jQuery实现的导航下拉菜单效果.分享给大家供大家参考,具体如下: 1.效果如图所示: 2.html代码: <div id="navigation"> <ul> <li><a href="#">首 页</a></li> <li><a href="#">衬 衫</a> <ul> <li><a hr

jquery实现适用于门户站的导航下拉菜单效果代码_jquery

本文实例讲述了jquery实现适用于门户站的导航下拉菜单效果代码.分享给大家供大家参考.具体如下: 这是一款应用了jQuery+CSS共同编写实现的网页导航菜单,采用浅蓝色的布局方式,整体格调淡雅清新,简洁大方,不失为一款好菜单.本特点的特点是兼容好,在火狐/IE下都有良好表现,而且在有二级子菜单的地方,主菜单上都会有一个小三角标识,很好的提升了用户体验,相信你也会喜欢的. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-web-i