首页  |  系统优化  |  推荐教程  |  常用工具  |  系统工具  |  电脑常识  |  软件技巧  |  攻防天地  |  认证考试  |  故障解决  |  电脑维护  |  站内新闻公告
您的位置：学习中国 → 推荐教程 → 正文
热门文章
• 20种常用的Ps技术,让你的
• PHP-动态内容和数据库交
• 月亮 地球 太阳旋转演示
• 用scanf和gets输入字符串
• ASP学习第一课
• 看flash示例学脚本语言编
• 如何用ASP创建日志文件
• asp中md5如何加密
• 你的人民币金额大写数字
• 怎么让窗体透明后，控件
• ASP常用代码
• Flash 8 动作补间动画详
• 循环语句中的break和con
• 用VB做个漂亮的进度条
• asp初学者怎么学asp
推荐文章
• ASP万用分页程序
• 用ASP建立站内信息搜索系
• 用ASP实现支持附件的EMa
• 用ASP建立一个简单的聊天
• 利用ASP打造网站论坛DIY
• 用ASP设计网站在线人数统
• ASP在InterDev中实现网上
• 用ASP制作张扬个性的调查
• 用ASP设计一个留言薄
• 用asp实现一个真正的注册
• 推荐阅读：php技术生成静
• Delphi 2006! (Dexter(1
• Delphi 2006! (Dexter(2
• 在VB中使用水晶报表的一
• C与C++中标准输入实现方
最新文章
• 20种常用的Ps技术,让你的
• C++Win32APIReadFile()读
• PHP-动态内容和数据库交
• 如何实现PHP抓取和分析
• 如何PHP面向对象编程快速
• 一起来了解PHP的出生传奇
• 网站动感十足的秘密
• ASP学习第一课
• 如何用ASP创建日志文件
• 戴尔电脑『安装Windows
• 光线电子商务平台 V2008
• Jsp&Servelet 学习笔记(
• Jsp&Servelet 学习笔记(
• Jsp&Servelet 学习笔记(
• Jsp&Servelet 学习笔记(
HTML表单元素覆盖样式元素问题及其补救之道(2)
原作者:admin 添加时间:2007-05-19 原文发表:2007-05-19 人气:3
本文章共2757字，分2页，当前第2页，快速翻页：
 
-----------------------------------------------------------------------------------------------------------------------------------------------

本文提示：《HTML表单元素覆盖样式元素问题及其补救之道(2)》是本站编辑们为广大网友精选的实用文章，本文阐述了关于文章的相关理论，相对来说专业性强，但是本文只是针对于某个问题提出的见解与论述，未必能辐射到相关问题的方方面面，所以本文处理问题的方法仅仅为您提供一些参考。更多问题请查阅学习中国网其他栏目哦.

-----------------------------------------------------------------------------------------------------------------------------------------------


var isActive = false;

function showMenu(){
isActive = true;
//document.getElementById("lb_1").style.visibility="hidden";
document.getElementById("subMenus").style.visibility="visible";
}

function hideMenu(){
isActive = false;
setTimeout('hide()',100);
}

function hide(){
if(!isActive){
document.getElementById("subMenus").style.visibility = "hidden";
document.getElementById("lb_1").style.visibility="visible";
}
}

function setStyle(menuItem){
isActive = true;
menuItem.style.backgroundColor = "Gray";
menuItem.style.color = "#FFFFFF"
}

function setDefault(menuItem){
isActive = false;
menuItem.style.backgroundColor = "";
menuItem.style.color = ""
hideMenu();
}
</script></head><body>

<div id="main" style="position:absolute;width:200px;">
<div id="menuBlock" class="menuBlock" onmouseover="showMenu();"
onmouseout="hideMenu();">CSS菜单</div>
<div id="subMenus" >
<div id="0" onmouseover="setStyle(this)"
onmouseout="setDefault(this)" >菜单项目一</div>
<!--共四个菜单项目 -->
</div><P>
<select id="lb_1" name="lb_1">
<option value="-1"/>选择列表
　<!-- 三个选项 -->
</select>
</div>
</body></html>

　　页面的<STYLE>部分定义了三个样式，分别用于菜单条、菜单项目、选择列表，通过样式定义保证菜单、选择列表的显示区域重叠。<BODY>部分包含菜单和<SELECT>选择列表的定义。当鼠标经过菜单条时，JavaScript函数showMenu执行，显示出菜单，同时隐藏SELECT选择列表。鼠标离开后，hideMnu函数隐藏菜单，同时恢复选择列表。其余几个JavaScript函数主要用于模拟菜单动作，鼠标经过菜单项时以高亮度显示菜单（setStyle函数），鼠标离开菜单项目时则将它恢复默认显示形式（setDefault函数）。页面的运行效果如图二所示。将showMenu函数中的document.getElementById("lb_1").style.visibility="hidden"语句注释掉就可以看到图一的效果。

<descript>
<img src=/cce/img/553/04601t02.jpg>
</descript>

　　总之，表单元素覆盖样式元素的根源在于HTML元素默认的显示优先级规则。本文介绍的补救办法确实行之有效，不过如果你实在不想用这种办法，那就只好考虑改变页面布局，避免表单元素和样式元素的显示区域重叠。


 
本文章更多内容：<<上一页 - 1 - 2
本页地址
相关文章
• Html网页页面head区规范知识
• 快速启动学习HTML初级指南
• 推荐阅读：php技术生成静态页面的实现
• 用asp实现一个真正的注册页面
• 用ASP设计一个留言薄
• 用ASP制作张扬个性的调查系统
• ASP在InterDev中实现网上购物推车
• 用ASP设计网站在线人数统计程序
• 利用ASP打造网站论坛DIY
• 用ASP建立一个简单的聊天室
• Jsp基础知识总结
• JSP入门初级教程之Session的使用
• JSP入门初级教程之预定义变量的使用
• 一个简单上传文件出错的解决
• php新手入门（经验谈)
• 珍藏的实用代码
• jsp Servlet基础入门学习篇 一、Servlet和J
• JSP基础_在linux上建jsp環境-jsp
• JSP基础_IIS 配置JSP环境全攻略-jsp
• JSP基础_JDBC 入门(三)-jsp

相关评论

本文章所属分类：首页 → 推荐教程   HTML学习
文章搜索


 
返回网站首页