<html>
<script type="text/JavaScript">
function show1(event)
{
var sourceObj=event.srcElement||event.target;
var targetObj=document.getElementById("test1");
targetObj.style.left=sourceObj.offsetLeft;
targetObj.style.top=sourceObj.offsetTop+sourceObj.offsetHeight;
}
function show2(event)
{
var sourceObj=event.srcElement||event.target;
var targetObj=document.getElementById("test2");
targetObj.style.left=sourceObj.offsetLeft+sourceObj.offsetWidth;
targetObj.style.top=sourceObj.offsetTop;
}
function show3(event)
{
var sourceObj=event.srcElement||event.target;
var targetObj=document.getElementById("test3");
targetObj.style.left=sourceObj.offsetLeft+sourceObj.offsetWidth;
targetObj.style.top=sourceObj.offsetTop+sourceObj.offsetHeight;
}
</script>
<body>
<input name="button1" type="button" value="层测试1" onClick="show1(event);">
<input name="button2" type="button" value="层测试2" onClick="show2(event);">
<input name="button3" type="button" value="层测试3" onClick="show3(event);">
<br>
<br><br>
<div id="test1" style="position:absolute;height:60; width:120;border:1px #feda32 solid;background-color:#33aad2;">
层1
</div>
<br><br><br>
<div id="test2" style="position:absolute;width:120;height:60;border:1px #feda32 solid;background-color:#33aad2;">
层2
</div>
<br><br><br>
<div id="test3" style="position:absolute;width:120;height:60;border:1px #feda32 solid;background-color:#33aad2;">
层3
</div>
</body>
<html>