JS實(shí)現(xiàn)仿中關(guān)村論壇評(píng)分后彈出提示效果的方法
本文實(shí)例講述了JS實(shí)現(xiàn)仿中關(guān)村論壇評(píng)分后彈出提示效果的方法。分享給大家供大家參考。
 本文實(shí)例講述了JS實(shí)現(xiàn)仿中關(guān)村論壇評(píng)分后彈出提示效果的方法。分享給大家供大家參考。具體實(shí)現(xiàn)方法如下:
- <!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仿中關(guān)村論壇評(píng)分后彈出提示的效果</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="謝謝參與!經(jīng)驗(yàn)+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>
 
希望本文所述對(duì)大家的javascript程序設(shè)計(jì)有所幫助。
原文鏈接:http://www.chengxuyuans.com/javascript/91935.html
責(zé)任編輯:王雪燕 
                    來(lái)源:
                    程序員之家
 















 
 
 


 
 
 
 