如何在下列代码中实现弹窗口能用鼠标移动

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>
alert</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="gb2312" />
<style type="text/css">
 *{
 margin:0;padding:0;
}

</style>
</head>
<body>

<div class="cecmbody" id="cecmpolicy">
<div class="leftClass" >
<input type="radio" name="paytype" value="worldpay" onClick="sAlert('This payment will be handled through Paydollar under the account ok-battery.com or notebook-laptop-batteries.com. We recommend you to use PayPal which also support credit card payment.',this);" />
测试</div>
 a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a
<div class="rightClass">
</div>
</div>
<script type="text/javascript" language="javascript"> function sAlert(txt){
var eSrc=(document.all)?window.event.srcElement:arguments[1];
var shield = document.createElement("DIV");
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = "100%";
shield.style.height = ((document.documentElement.clientHeight>document.documentElement.scrollHeight)?document.documentElement.clientHeight:document.documentElement.scrollHeight)+"px";
shield.style.background = "#FFFFFF";//可以设置弹出窗口后页面渐变的颜色;
shield.style.textAlign = "center";
shield.style.zIndex = "10000";
shield.style.filter = "alpha(opacity=0)";
shield.style.opacity = 0;

var alertFram = document.createElement("DIV");
alertFram.id="alertFram";
alertFram.style.position = "absolute";

alertFram.style.left ="500px";
alertFram.style.top = "300px";
 alertFram.style.marginLeft = "-225px" ;
alertFram.style.marginTop = -75+document.documentElement.scrollTop+"px";
alertFram.style.width = "300px";
alertFram.style.height = "150px";
alertFram.style.background = "#ccc";
alertFram.style.textAlign = "center";
alertFram.style.lineHeight = "150px";
alertFram.style.zIndex = "10001";
alertFram.style.cursor="move";
//onmousedown=MoveDiv.Move('alertFram');
strHtml = "<ul style=\"list-style:none;margin:0px;padding:0px;width:100%\">\n";

//strHtml += "<li style=\"background-image: url(images/5.jpg);text-align:center;font-size:12px;height:120px;line-height:25px;border-left:0px solid #F9CADE;border-right:0px solid #F9CADE;\">"+txt+"</li>\n";
strHtml += "<li style=\"background:#FDEEF4;text-align:center;font-size:12px;height:120px;line-height:25px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;border-top:1px solid #F9CADE; \">"+txt+"</li>\n";
strHtml += "<li style=\"background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE; border-bottom:1px solid #F9CADE; \"><input style=\"background:#FDEEF4\" type=\"button\" value=\"CLOSE\" id=\"do_OK1\" onclick=\"doOk()\" /></li>\n";
strHtml += "</ul>\n";
alertFram.innerHTML = strHtml;
document.body.appendChild(alertFram);
document.body.appendChild(shield);
this.setOpacity = function(obj,opacity){
if(opacity>=1)opacity=opacity/100;
try{ obj.style.opacity=opacity; }catch(e){}
try{
if(obj.filters.length>0&&obj.filters("alpha")){
obj.filters("alpha").opacity=opacity*100;
}else{
obj.style.filter="alpha(opacity=\""+(opacity*100)+"\")";
}
}catch(e){}
}
var c = 0;
this.doAlpha = function(){
if (++c > 20){clearInterval(ad);return 0;}
setOpacity(shield,c);
}
var ad = setInterval("doAlpha()",1);
this.doOk = function(){
//alertFram.style.display = "none";
//shield.style.display = "none";
document.body.removeChild(alertFram);//弹出对话框后点确定后消息。
document.body.removeChild(shield);//当弹出对话框后整个页面变灰后，点击确定后能恢复原来颜色。
eSrc.focus();
document.body.onselectstart = function(){return true;}
document.body.oncontextmenu = function(){return true;}
 //window.location.href("http://www.batterien-profi.de/"); //当点击弹出窗口后转到此页面；
}
document.getElementById("do_OK1").focus();
eSrc.blur();
document.body.onselectstart = function(){return false;}
document.body.oncontextmenu = function(){return false;}
}
</script>
</body>
</html> 最好能提供完整的代码,多谢,多谢!!!

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

基于你的修改了一下，已经可以移动了！
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>
alert </title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="Content-Language" content="gb2312" />
<style type="text/css">
 *{
 margin:0;padding:0;
} </style>
</head>
<body> <div class="cecmbody" id="cecmpolicy">
<div class="leftClass" >
<input type="radio" name="paytype" value="worldpay" onClick="sAlert('This payment will be handled through Paydollar under the account ok-battery.com or notebook-laptop-batteries.com. We recommend you to use PayPal which also support credit card payment.',this);" />
测试 </div>
 a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a a 
<div class="rightClass">
</div>
</div>
<script type="text/javascript" language="javascript">
var cao_x, cao_y;
function moveLogin(_this) {
 var loginObj = _this;
 cao_x = event.x - loginObj.style.pixelLeft;
 cao_y = event.y - loginObj.style.pixelTop;
 _this.setCapture();
 } function caoMove(_this) //实现层的拖移
 {
 var loginObj = _this;
 if (event.button == 1) {
 var caoX = loginObj.clientLeft;
 var caoY = loginObj.clientTop;
 loginObj.style.pixelLeft = caoX + (event.x - cao_x);
 loginObj.style.pixelTop = caoY + (event.y - cao_y);
 }
 }function sAlert(txt){
var eSrc=(document.all)?window.event.srcElement:arguments[1];
var shield = document.createElement("DIV");
shield.id = "shield";
shield.style.position = "absolute";
shield.style.left = "0px";
shield.style.top = "0px";
shield.style.width = "100%";
shield.style.height = ((document.documentElement.clientHeight>document.documentElement.scrollHeight)?document.documentElement.clientHeight:document.documentElement.scrollHeight)+"px";
shield.style.background = "#FFFFFF";//可以设置弹出窗口后页面渐变的颜色;
shield.style.textAlign = "center";
shield.style.zIndex = "10000";
shield.style.filter = "alpha(opacity=0)";
shield.style.opacity = 0;
var alertFram = document.createElement("DIV"); //新增移动事件！开始-----------------------------
alertFram.onmousedown=function(){moveLogin(this);};
alertFram.onmouseup=function(){this.releaseCapture();};
alertFram.onmousemove=function(){caoMove(this);};
//事件增加结束-----------------------------------alertFram.id="alertFram";
alertFram.style.position = "absolute"; alertFram.style.left ="500px";
alertFram.style.top = "300px";
 alertFram.style.marginLeft = "-225px" ;
alertFram.style.marginTop = -75+document.documentElement.scrollTop+"px";
alertFram.style.width = "300px";
alertFram.style.height = "150px";
alertFram.style.background = "#ccc";
alertFram.style.textAlign = "center";
alertFram.style.lineHeight = "150px";
alertFram.style.zIndex = "10001";
alertFram.style.cursor="move";
//onmousedown=MoveDiv.Move('alertFram');
strHtml = " <ul style=\"list-style:none;margin:0px;padding:0px;width:100%\">\n";

//strHtml += " <li style=\"background-image: url(images/5.jpg);text-align:center;font-size:12px;height:120px;line-height:25px;border-left:0px solid #F9CADE;border-right:0px solid #F9CADE;\">"+txt+" </li>\n";
strHtml += " <li style=\"background:#FDEEF4;text-align:center;font-size:12px;height:120px;line-height:25px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;border-top:1px solid #F9CADE; \">"+txt+" </li>\n";
strHtml += " <li style=\"background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE; border-bottom:1px solid #F9CADE; \"> <input style=\"background:#FDEEF4\" type=\"button\" value=\"CLOSE\" id=\"do_OK1\" onclick=\"doOk()\" /> </li>\n";
strHtml += " </ul>\n";
alertFram.innerHTML = strHtml;
document.body.appendChild(alertFram);
document.body.appendChild(shield);
this.setOpacity = function(obj,opacity){
if(opacity>=1)opacity=opacity/100;
try{ obj.style.opacity=opacity; }catch(e){}
try{
if(obj.filters.length>0&&obj.filters("alpha")){
obj.filters("alpha").opacity=opacity*100;
}else{
obj.style.filter="alpha(opacity=\""+(opacity*100)+"\")";
}
}catch(e){}
}
var c = 0;
this.doAlpha = function(){
if (++c > 20){clearInterval(ad);return 0;}
setOpacity(shield,c);
}
var ad = setInterval("doAlpha()",1);
this.doOk = function(){
//alertFram.style.display = "none";
//shield.style.display = "none";
document.body.removeChild(alertFram);//弹出对话框后点确定后消息。
document.body.removeChild(shield);//当弹出对话框后整个页面变灰后，点击确定后能恢复原来颜色。
eSrc.focus();
document.body.onselectstart = function(){return true;}
document.body.oncontextmenu = function(){return true;}
 //window.location.href("http://www.batterien-profi.de/"); //当点击弹出窗口后转到此页面；
}
document.getElementById("do_OK1").focus();
eSrc.blur();
document.body.onselectstart = function(){return false;}
document.body.oncontextmenu = function(){return false;}
} </script>
</body>
</html>
pixelLeft 属性只能在ie里用，应该用style.left,style.top，两个属性控制移动，这里个属性的单位都是px，也就是一个数字接一个px如10px，用的时候节下字符串
...修改部分如下:但是都不能移动了var cao_x, cao_y;
function moveLogin(_this) {
        var loginObj = _this;
        cao_x = event.x - loginObj.style.Left+"px";//鼠标点到弹窗边界值;
        cao_y = event.y - loginObj.style.Top+"px";
        _this.setCapture();
    }    function caoMove(_this) //实现层的拖移
    {
        var loginObj = _this;
        if (event.button == 1) {
            var caoX = loginObj.clientLeft;
            var caoY = loginObj.clientTop;
            loginObj.style.Left = caoX + (event.x - cao_x) +"px";
            loginObj.style.Top = caoY + (event.y - cao_y) +"px";
        }
    }
...