js实现div闪烁原理及实现代码

标签:新闻动态    日期:2018-04-09 12:38    录入:汇盛国际平台    浏览:

  

[div闪烁]js实现div闪烁原理及实现代码

  

最近在学着用easyui,发现框架用起来果然是方便简洁,能弄出这框架的都是大神级别了吧,牛啊....

  

  

今天碰到这个应用可以说是让我非常之无语,整出源码来一看就明白了,可之前却还是感觉非常神奇,我也常常告诉自己,要多动脑筋,实际上有一些也的确有想过,但实在是效果很牵强,而当源码拿出来看的时候却又格外的明白,如果这时候我可以看到自己的表情,大抵就是一个纠结吧,如果说量变引起质变,那我的量还差的太多了,连见多识广都算不上,何谈创造啊。

  

  

先来分析下实现的原理吧,闪烁的原理是什么呢:其实就一个,display在none与block之间频繁的交替,这样说你明白了么。

  

  

还是先上代码:  

  

html部分:  
  

  
  
  
//是不是很熟悉啊  javascript部分:  window.onload=function(){  var obj=document.getElementById("showZone");  var timer=null;  obj.onclick=function(){  var i=0;  clearInterval(timer);  timer=setInterval(function(){  obj.style.display=i++%2?"none":"block";//还是有收获的,这个写法比if..else想必简单了好多  i>8&&clearInterval(timer);//这个短路用的经典啊  },80);  };  };
  
  

虽然原理上简单,但是前辈的代码比我个人编写的代码要简单太多了,还是很有收获的。

  

  

easyui也进入学习日程了,这一天天的是越排越满啊......加油,笨鸟飞飞飞.....

  

★★★小编:汇盛国际注册 整理文章,欢迎大家转载 ★★★
上一篇:JS实现仿新浪黄色经典滑动门效果代码
下一篇:没有了