Question

有多个div 点击其中一个 这个div在最上面(z-index)

z-index 动态的变动

Answer 1

把以下代码保存成html文件再浏览器就能看到效果了
<div style="position:absolute; top:100px; left:100px; width:100px; height:100px; background-color:#FF0000; z-index:1;" onclick="changeZindex(this);">1</div>
<div style="position:absolute; top:100px; left:150px; width:100px; height:100px; background-color:#3333FF; z-index:2;" onclick="changeZindex(this);">2</div>
<div style="position:absolute; top:150px; left:100px; width:100px; height:100px; background-color:#990099; z-index:3;" onclick="changeZindex(this);">3</div>
<div style="position:absolute; top:150px; left:150px; width:100px; height:100px; background-color:#336600; z-index:4;" onclick="changeZindex(this);">4</div>
<script language="javascript">
function changeZindex(obj){
var divs = document.getElementsByTagName("DIV");
var maxNum = 0;
for(var i = 0; i < divs.length; i++){
var tempNum = divs[i].style.zIndex;
tempNum = (tempNum) ? parseInt(tempNum) : 0;

if(tempNum > maxNum) maxNum = tempNum;
}
obj.style.zIndex = maxNum + 1;
}
</script>

Answer 2

document.getElementById('显示的div-ID').style.zIndex=100000;()
document.getElementById('其他的div-ID').style.zIndex=1;()

Answer 3

<div id="div_id"></div>

document.getElementById('div_id').style.z-index=1000;

Answer 4

JQ：
<div id="test">
<div id="t1"></div>
<div id="t2"></div>
<div id="t3"></div>
<div id="t4"></div>
<div id="t5"></div>
</div>
$(function(){
$("#test div").click(function(){
$(this).css("zIndex","9999").siblings().css("zIndex","1000");
});
});