首页 > 代码库 > 文字淡入淡出详解

文字淡入淡出详解

实现方法:字符串的拼接

1.将文字写入盒子里,设置文字淡入淡出实质是指盒子的透明效果
2.获取盒子id
3.为盒子设置透明变量值i
4.区分ie浏览器及其他浏览器透明度设置
5.判断透明度自增与自减值
6.如果i<100实现自增,否则实现自减,但是有部分值既在自增又在自减
7.设置标志,使中间自增与自减的部分区分开
8.设置定时器


<!-- 实现淡入淡出效果代码部分 -->


<div id="box">This is a fade text</div>
<script>
  var i=1;
  var flag=true;
  function fade(){
  var box=document.getElementById(‘box‘);
  if(document.all){
  box.style.filter="alpha(opacity=‘+i+‘)";
  }else{
  box.style.opacity=parseFloat(i/100);
  }
  if(i<100 && flag){
  i+=5;
  }
  else{
  flag=false;
  }
  if(i>0 && !flag){
  i-=5;
  }
  else{
  flag=true;
  }
  setTimeout(‘fade()‘,200);
  }
  fade();
</script>

文字淡入淡出详解