<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>基于层的网页弹出提示,可移动,网页变灰-/</title>
<style type="text/css">
<!--
html,body{
 height:100%;
}
* {
 padding:0;
 margin:0;
}
#upcontent {
 list-style-position: outside;
 list-style-image: none;
 list-style-type: none;
}
#upcontent li {
 font-size:12px;
 color:#333;
 line-height:150%;
}
#bodyL {
 float:left;
 width:84px;
 margin-right:2px;
}
#tittleup {
 font-size:14px;
 font-weight:bold;
 padding-left:25px;
 border-bottom-width: 1px;
 border-bottom-style: solid;
 border-bottom-color: #d0daec;
 margin-bottom: 10px;
 padding-bottom: 10px;
}
a.od {
 float:right;
 font-size:14px;
 text-decoration: none;
}
a.od:hover {
 color:#FF0000;
}
#fd {
 background:#EDF1F8;
 border: 2px solid #849BCA;
 margin-top:2px;
 margin-left:2px;
 float:left;
 overflow:hidden;
 position:absolute;
 left:0px;
 top:0px;
 cursor:move;
 float:left;/*filter:alpha(opacity=50);*/
 z-index: 10;
}
.contentup {
 padding:20px;
}
}
-->
</style>
</head>
<body >
<div ;
        }
    }   

    /*-------------------------鼠标拖动---------------------*/   
    var od = document.getElementById("fd");   
    var dx,dy,mx,my,mouseD;
    var odrag;
    var isIE = document.all ? true : false;
    document.onmousedown = function(e){
        var e = e ? e : event;
        if(e.button == (document.all ? 1 : 0))
        {
            mouseD = true;           
        }
    }
    document.onmouseup = function(){
        mouseD = false;
        odrag = "";
        if(isIE)
        {
            od.releaseCapture();
            od.filters.alpha.opacity = 100;
        }
        else
        {
            window.releaseEvents(od.MOUSEMOVE);
            od.style.opacity = 1;
        }       
    }

    //function readyMove(e){   
    od.onmousedown = function(e){
        odrag = this;
        var e = e ? e : event;
        if(e.button == (document.all ? 1 : 0))
        {
            mx = e.clientX;
            my = e.clientY;
            od.style.left = od.offsetLeft + "px";
            od.style.top = od.offsetTop + "px";
            if(isIE)
            {
                od.setCapture();               
                od.filters.alpha.opacity = 50;
            }
            else
            {
                window.captureEvents(Event.MOUSEMOVE);
                od.style.opacity = 0.5;
            }
           
            //alert(mx);
            //alert(my);
           
        }
    }
    document.onmousemove = function(e){
        var e = e ? e : event;
       
        //alert(mrx);
        //alert(e.button);       
        if(mouseD==true && odrag)
        {       
            var mrx = e.clientX - mx;
            var mry = e.clientY - my;   
            od.style.left = parseInt(od.style.left) +mrx + "px";
            od.style.top = parseInt(od.style.top) + mry + "px";           
            mx = e.clientX;
            my = e.clientY;
           
        }
    }
function showBackground(obj,endInt)
{
obj.filters.alpha.opacity+=1;
if(obj.filters.alpha.opacity<endInt)
{
setTimeout(function(){showBackground(obj,endInt)},8);
}
}
</script>
</body>
</html>

相关文章:

  • 2021-05-30
  • 2022-12-23
  • 2021-09-10
  • 2022-02-09
  • 2021-08-17
  • 2021-11-30
  • 2021-09-13
猜你喜欢
  • 2021-05-27
  • 2021-07-01
  • 2022-02-08
  • 2021-08-24
  • 2021-09-12
  • 2022-12-23
相关资源
相似解决方案