overflow的浏览器兼容性问题

神之梦

本帖最后由第一印象于 2013-9-5 21:51 编辑

以下这段代码在火狐浏览器中显示有效(菜单能够打开和关闭)，但在IE10中显示无效，而Aptana给的提示是两者都有效，这是什么情况，主要问题是
overflow的问题，在IE10中对dl标签无效，但有趣的是，如果我的dl标签不作为body标签的第一个子元素存在就没问题了，就是说在dl标签前面加个hr标签或者任意其他标签，dl标签中的overflow属性又会生效了

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Insert title here</title>
<style type="text/css">
dl dd{
margin:0px;
}
.close{
height:16px;
overflow:hidden;
}
.open{
height:16px;
overflow:visible;
}
</style>
<script type="text/javascript">
function showMenu(node){
var oDL = node.parentNode;
if(oDL.className=="open"){
oDL.className = "close";
}else{
oDL.className = "open";
}
}
</script>
</head>
<body>
<dl class="close">
<dt onclick="showMenu(this)">显示菜单</dt>
<dd>我的第一个菜单</dd>
<dd>我的第二个菜单</dd>
<dd>我的第三个菜单</dd>
</dl>
</body>
</html>

复制代码

神之梦 · 神之梦

很明显有抽风的，先了解怎么用就ok

帐号		自动登录	找回密码
密码			加入黑马

overflow的浏览器兼容性问题

评分

1 个回复

黑马骑士勋章