为什么DIV不响应事件？

Question

我写了这么句代码，在img上面叠加了个div:    
fla_div.innerHTML = "<img id='img' src='img/flash_pic/pic_1.png' style='margin-left:0;margin-top:0;float:left;'/><div id='up_div' style='margin-left:0;margin-top:0;width:640px;height:380px;border:2px solid yellow;'/>";
奇怪的事情出现了，img能够接受事件响应，但是div不行。 
var img = document.getElementById("img");
var updiv = document.getElementById("up_div");
img.onmousedown = function () {
        alert("img mouse down");   //可以触发
    };updiv.onmousedown = function () {
        alert("div mouse down");   //触发不了
    };我在img上加了z-index:1; 在div上加了z-index:2;试图调整顺序，但还是不行，请教各位达人这是怎么回事呢？

Answer 1

给div加个背景色  或者边框 试试看   div是否在img的上面 ？

Answer 2

直接加z-index没用的，z-index要和position一起使用。先确定下DIV是不是在img上面

Answer 3

我设置了img的z-index为1;div的z-index为2;依然不行。这样应该能保证div在上面了吧？但是不凑效哦。。
我设置了背景色，但奇怪的是，img的图像还是在上面
求救啊

Answer 4

正解啊！要加position的！现在可以响应了！

Answer 5

你这样写是图片在上，DIV在下吧。
都加上position:absolute;top:0;left:0;才对吧。

Answer 6

fla_div　这个的样式在firebug里看一下。

Answer 7

我用的是position:relative;top:0;left:0; 这样子div改到上面去了，但是我去掉背景的时候，还是响应不了啊。

Answer 8

<div onmousedown="alert('img mouse down')" style='position: absolute;top:0;left: 0;z-index: 1;width:640px;height:380px;background-color: #000000;'></div>
<div onmousedown="alert('div mouse down')" style='position: absolute;top:0;left: 0;z-index: 2; width:640px;height:380px;border:2px solid yellow;'></div>
有没背景都一样吧，这样不是显示div mouse down了吗。