一个简单的获取鼠标位置： <a href="javascript:void(0);" onclick="x(this)" alt='aa'>海波吧</a> <br /><br /> <br><input type="text" onclick="x(this)" value="cccc1"> <br /><br /> <br><input type="text" onclick="x(this)" value="cccc2"> <br /><br /> <br><input type="text" onclick="x(this)" value="cccc3"> <br /><br /> <br><input type="text" onclick="x(this)" value="cccc4"> <br /><br /> <div id="div1"></div> <br /><br /> <br /><br /> <script> <br /><br /> function x(o) <br /><br /> { <br /><br /> document.all.div1.style.visibility="visible"; <br /><br /> document.all.div1.innerText=o.value; <br /><br /> document.all.div1.style.top=event.clientY; <br /><br /> document.all.div1.style.left=event.clientX; <br /><br /> alert(event.clientX+ " "+event.clientY); <br /><br /> <br /><br /> var a = window.event.x; <br /><br /> var b = window.event.y; <br /><br /> alert(a+" "+ b); <br /><br /> <br /><br /> } <br /><br /> </script> 获取鼠标位置后，我们就可以控制window.open 弹出层的位置 <script> <br /><br /> function ccc() <br /><br /> { <br /><br /> k=window.showModalDialog(http://www.baidu.com,null,"dialogwidth:250px;dialogheight:250px;dialogtop:"+ event.screenY+";dialogleft:" + event.screenX); <br /><br /> } <br /><br /> </script> <br /><br /> <input type="text" value="" onclick="ccc()" > 一个弹出层，点击层外面也可以关闭层 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <br /><br /> <HTML> <br /><br /> <HEAD> <br /><br /> <TITLE>海波吧 www.haibor8.cn </TITLE> <br /><br /> <style> <br /><br /> #alert {font-size:12px;border:1px solid #369;width:200px;height:200px;background:#e2ecf5;z-index:1000;position:absolute;} <br /><br /> </style> <br /><br /> <script> <br /><br /> function hid() <br /><br /> { <br /><br /> var myAlert = document.getElementById("alert"); <br /><br /> myAlert.style.display = "none"; <br /><br /> } <br /><br /> function onsub(name) <br /><br /> { <br /><br /> <p> // mClose.onclick(); <br /><br /> hid(); <br /><br /> document.getElementById("new_one").value=name.innerText; <br /><br /> } <br /><br /> function new_hid() <br /><br /> { <br /><br /> hid(); <br /><br /> } <br /><br /> </script> <br /><br /> <br /><br /> </HEAD> <br /><br /> <BODY> <br /><br /> <br /><br /> <Br><Br><Br> <br /><br /> <span id="content"><input type="text" value="" class="tx4" id="new_one"></span> <br /><br /> <br /><br /> <div id="alert" style="display:none;"> <br /><br /> <br /><br /> <p><a href="javascript:void(0);" onClick="onsub(this);">test1</a></p> <br /><br /> <p><a href="javascript:void(0);" onClick="onsub(this);">test2</a></p> <br /><br /> <p><a href="javascript:void(0);" onClick="onsub(this);">test3</a></p> <br /><br /> <p><a href="javascript:void(0);" onClick="onsub(this);">test4</a></p> <br /><br /> <br /><br /> <p><center><span id="close" style="cursor:hand;">close</span></center></p> <br /><br /> </div> <br /><br /> <br /><br /> <div style="width:100%;height:100%;" onClick="new_hid();"></div> <br /><br /> <br /><br /> <script type="text/javascript"> <br /><br /> var myAlert = document.getElementById("alert"); <br /><br /> var reg = document.getElementById("new_one"); <br /><br /> var mClose = document.getElementById("close"); <br /><br /> reg.onclick = function() <br /><br /> { <br /><br /> myAlert.style.display = "block"; <br /><br /> myAlert.style.position = "absolute"; <br /><br /> myAlert.style.width="200px"; <br /><br /> //myAlert.style.height="200px"; <br /><br /> // var a = window.event.x; <br /><br /> // var b = window.event.y; <br /><br /> // alert(a+ " "+b); <br /><br /> myAlert.style.top=event.clientY; <br /><br /> myAlert.style.left=event.clientX; <br /><br /> } <br /><br /> mClose.onclick = function() <br /><br /> { <br /><br /> myAlert.style.display = "none"; <br /><br /> } <br /><br /> </script> <br /><br /> </BODY> <br /><br /> </HTML>
