特效描述:利用js css3实现 文字闪光滑过 动画特效。利用js css3实现文字闪光滑过动画特效
代码结构
1. HTML代码
body{background:#222;text-align:center;}
#phone{width:1100px;margin:0 auto;display:inline-block;margin:50px;font-size:150px;font-weight:bold;color:rgba(255,255,255,0.3); background:-webkit-linear-gradient(-30deg,rgba(255,255,255,0) 100px,rgba(255,255,255,1) 180px,rgba(255,255,255,1) 240px,rgba(255,255,255,0) 300px) -300px 0 no-repeat; -webkit-background-clip:text;}
var ph=document.getElementById("phone");
var otime=null;
var num=-300;
function tomove(){
otime=setInterval(function (){
num+=10;
if(num==1100)
{
num=-300;
clearInterval(otime);
}
ph.style.backgroundPosition=num+"px 0px";
},20)
}
tomove();
setInterval(function(){
tomove();
},3000);