JS实现仿中关村论坛评分后弹出提示效果的方法

系统管理员 2021-04-22 16:03 398阅读 0赞

![JS实现仿中关村论坛评分后弹出提示效果的方法][JS]

本文实例讲述了JS实现仿中关村论坛评分后弹出提示效果的方法。分享给大家供大家参考。具体实现方法如下：

````
<!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> 
 <title>JS仿中关村论坛评分后弹出提示的效果</title> 
 </head> 
 <body> 
 <script language="javascript"> 
 var x=window.x||{}; 
 x.creat=function(t,b,c,d){ 
  this.t=t; 
  this.b=b; 
  this.c=c; 
  this.d=d; 
  this.op=1; 
  this.div=document.createElement("div"); 
  this.div.style.height="40px"; 
  this.div.style.width="100px"; 
  this.div.style.background="red"; 
  this.div.style.position="absolute"; 
  this.div.style.left="50%"; 
     this.div.style.marginLeft="-50px" 
  this.div.style.marginTop="-20px" 
  this.div.innerText="谢谢参与！经验+5" 
  this.div.style.fontSize="12" 
  this.div.style.lineHeight=this.div.style.height 
  this.div.style.textAlign="center"; 
  this.div.style.fontWeight="bold";  
  //this.div.style.border="solid red 1px";  
  this.div.style.color="#fff" 
  this.div.style.top=(this.b+"%"); 
  document.body.appendChild(this.div); 
  this.run(); 
 } 
 x.creat.prototype={ 
  run:function(){ 
   var me=this; 
   this.div.style.top=-this.c*(this.t/this.d)*(this.t/this.d)+this.b+"%"; 
   this.t++; 
   this.q=setTimeout(function(){me.run()},25) 
   if(this.t==this.d){ 
    clearTimeout(me.q); 
    setTimeout(function(){me.alpha();},1000); 
   } 
  }, 
  alpha:function(){ 
   var me=this; 
   if("v"=="v"){ 
    this.div.style.filter="progid:DXImageTransform.Microsoft.Alpha(opacity="+this.op*100+")"; 
    this.div.style.filter="alpha(opacity="+this.op*100+")"; 
   ;} 
   else{ this.div.style.opacity=this.op} 
   this.op-=0.02; 
   this.w=setTimeout(function(){me.alpha()},25) 
   if(this.op<=0){ 
    clearTimeout(this.w); 
    document.body.removeChild(me.div); 
   } 
  } 
 } 
 new x.creat(1,50,25,30); 
 </script> 
 </body> 
 </html> 
````
希望本文所述对大家的javascript程序设计有所帮助。

[JS]: /images/20210423/1619107397254.jpg