在IE6/7下margin负值会被遮住

木头是猫 2012-02-19 08:51:35

在IE6/7下margin负值，内嵌的元素会被遮住，求助

由于条件问题，父元素必须是absolute

<div style="border:2px solid #000;width:200px;height:100px;margin:auto;top:100px;position: absolute;z-index:100;">

<div style="margin-top:-50px;height:100px;width:100px;background:#F00"></div>

</div>

...全文

294 7 打赏收藏转发到动态举报

写回复

用AI写文章

7 条回复

切换为时间正序

请发表友善的回复…

发表回复

dumianqian 2012-05-19

打赏
举报

看起来是因为animate执行后，对象会被设置overflow为hidden
可以试试设为overflow为visible
希望对你有用

木头是猫 2012-02-27

打赏
举报

这问题还有人懂不

去圣西罗-为尤文喝彩 2012-02-20

打赏
举报

IE6下测试，没发现你说的现象，见 http://jsfiddle.net/3kKXL/

请贴上完整的JQUERY代码。

木头是猫 2012-02-20

打赏
举报

[Quote=引用 4 楼 liyoc 的回复:]

hack: 子div, 使用 position:relative; 去脱离父容器的约束

如果不用hack, 可以再一次 position:absolute;
然后使用 top, left 去调整位置
[/Quote]
之前都有试过用了animate后就无效了

liyoc 2012-02-20

打赏
举报

hack: 子div, 使用 position:relative; 去脱离父容器的约束

如果不用hack, 可以再一次 position:absolute;
然后使用 top, left 去调整位置

木头是猫 2012-02-20

打赏
举报

[Quote=引用 2 楼 changjay 的回复:]

IE6下测试，没发现你说的现象，见 http://jsfiddle.net/3kKXL/

请贴上完整的JQUERY代码。
[/Quote]

<!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>

<script type="text/javascript" src="jquery-1.7.min.js"></script>

<style>

.abc{border:2px solid #000;width:200px;height:100px;margin:auto;top:100px;position: absolute;z-index:100;}

</style>

</head>



<body>

<a href="#" onclick="test()">TEST</a>

<div class="abc"></div>

<script>

function test(){

	$(".abc").animate({"width":"400px","height":"200px"},function(){

		$(".abc").html("<div style=\"margin-top:-50px;height:100px;width:100px;background:#F00\"></div>")

	})

}

</script>

</body>

</html>