移动的js浮动窗口



// JavaScript Document
getId=function(id){
return id=typeof string==id?id:document.getElementById(id);
}

function get(){
return {
X:document.documentElement.clientWidth||document.body.clientWidth||window.innerWidth,
Y:document.documentElement.clientHeight||document.body.clientheight||window.innerHeight
}
}
var floatFrame=new Object()
this.floatFrame=function(pId,style,title,content,time,x,y,l,t,cd){
var _this=this;
_this.pId=pId;
_this.style=style;
_this.title=title;
_this.content=content;
_this.time=time;
_this.x=x;
    _this.y=y;
_this.l=l;
_this.t=t;
_this.cd=cd;
    _this.init=function(n){
document.write("<div name='float_frame' style='"+_this.style+"' id="+_this.pId+">"
   +"<span id='closeDiv' style='cursor:pointer; position:absolute;top:0px;right:0px;display:none;'>[X]</span>"
       +"<div name='title' id='titleId"+n+"'></div>"
   +"<div name='content' id='contentId"+n+"'></div></div>");
   this.setTitle(_this.title,n);
   this.setContent(_this.content,n);
   _this.id=getId(_this.pId);
   this.setCloseDiv();
   this.Start();

   getId("closeDiv").onclick=function(){
   _this.Stop()
               _this.id.style.display="none";
   }
  _this.id.onmouseover=function(){
     _this.Stop();
  }
   _this.id.onmouseout=function(){
     _this.Start();
  }  
   }
_this.setTitle=function(tc,n){
getId("titleId"+n).innerHTML="<p>"+tc+"</p>";
}
_this.setContent=function(cc,n){
getId("contentId"+n).innerHTML="<h3>"+cc+"</h3>";
}
_this.setPosition=function(left,top){
left+=document.documentElement.scrollLeft||document.body.scrollLeft;
top+=document.documentElement.scrollTop||document.body.scrollTop;
_this.id.style.left=left+"px";
_this.id.style.top=top+"px";
}
_this.run=function(){
width=_this.id.style.width.split("px")[0];
height=_this.id.style.height.split("px")[0];

if(_this.x<=0){
_this.x=0;
_this.l=true;
}

else if(_this.x>=get().X-width){
_this.x=get().X-width;
_this.l=false;
}

   if(_this.l){
_this.x++;
}
else{
_this.x--;
}
 
if(_this.y>=get().Y-height){
_this.y=get().Y-height;
_this.t=false;
}
else if(_this.y<0){
_this.y=0;
_this.t=true;
}
if(_this.t){
_this.y++;
}
else{
_this.y--;
}

_this.setPosition(_this.x,_this.y)
}
_this.Stop=function(){
  clearInterval(timer);
}
_this.Start=function(){
timer=setInterval(_this.run,_this.time);
}
_this.setCloseDiv=function(){
if(_this.cd){getId("closeDiv").style.display="block";}
else{
  getId("closeDiv").style.display="none";
}
}

}


<script type="text/javascript">

var div1= new floatFrame(
"floatFrameId1",
"border:2px red solid;width:240px; height:120px; position:absolute;",
"",
"浮动框内容",
5,
100,
100,
true,
false,
true
  );

div1.init(0);  
</script>

你可能感兴趣的:(JavaScript)