This paper illustrates the method of JS to realize the effect of simulation Zhongguancun forum after scoring. Share to everyone for your reference. The implementation methods are as follows:
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<title>js Imitation Zhongguancun Forum score pop-up prompts after the effect of </title>
<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= "Thank you for your participation!" Experience +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>
I hope this article will help you with your JavaScript programming.