码迷,mamicode.com
首页 > 其他好文 > 详细

文字淡入淡出详解

时间:2016-09-05 07:57:36      阅读:141      评论:0      收藏:0      [点我收藏+]

标签:

实现方法:字符串的拼接

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>

文字淡入淡出详解

标签:

原文地址:http://www.cnblogs.com/kymming/p/5840980.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!