js实现div闪烁-------Day46
近期在学着用easyui,发现框架用起来果然是方便简洁,能弄出这框架的都是大神级别了吧,牛啊....
今天碰到这个应用能够说是让我很之无语,整出源代码来一看就明确了。可之前却还是感觉很奇妙,我也经常告诉自己。要多动脑筋。实际上有一些也的确有想过。但实在是效果很牵强。而当源代码拿出来看的时候却又格外的明确。假设这时候我能够看到自己的表情。大抵就是一个纠结吧,假设说量变引起质变,那我的量还差的太多了,连见多识广都算不上,何谈创造啊。
先来分析下实现的原理吧。闪烁的原理是什么呢:事实上就一个,display在none与block之间频繁的交替,这样说你明确了么。
还是先上代码:
html部分:
<div style="width: 50px;height: 50px;background-color: cyan;display: block;" id="showZone"></div>//是不是非常熟悉啊
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实现div闪烁-------Day46的更多相关文章
- js控制div滚动条,滚动滚动条使div中的元素可见并居中
1.html代码如下 <div id="panel"> <div id="div1"></div> <div id=& ...
- js实现div居中
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- js 控制Div循环显示 非插件版
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- JS控制DIV隐藏显示
转载自:http://blog.sina.com.cn/s/blog_6c3a67be0100ldbe.html JS控制DIV隐藏显示 一,需求描述: 现在有3个DIV块,3个超链接,需要点击一个链 ...
- 功能整合(一):滚动条的变相隐藏、js控制div的渐变显示、滚动条监听
1.滚动条的变相隐藏 思路: 1. 把body的横向,纵向的超出部分隐藏,宽设置100%:高设置100%.就没有body的滚动条了, 2. 然后把最外层的div的宽设置的比body的宽宽一点,把d ...
- JS 实现DIV 滚动至顶部后固定
JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...
- JS控制div跳转到指定的位置的几种解决方案总结
原文:http://www.jb51.net/article/96574.htm 这篇文章主要介绍了JS控制div跳转到指定的位置的几种解决方案总结,小编觉得挺不错的,现在分享给大家,也给大家做个参考 ...
- js控制div样式显示与隐藏,JS通过点击超链接右边(指定位置)显示一个图标
原文出自:https://blog.csdn.net/seesun2012 javascript基础篇,老土的方法解决js控制div样式,便于新手理解,粗暴的不能再粗暴,如果你是高手,请忽略! 思路: ...
- 用键盘控制DIV && Div闪烁
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- [Lydsy1805月赛] 对称数
挺不错的一道数据结构题QWQ. 一开始发现这个题如果不看数据范围的话,妥妥的树上莫队啊23333,然鹅10组数据是不可能让你舒舒服服的树上莫队卡过的23333 于是想了想,这个题的模型就是,把u到v链 ...
- [xsy2164]theory
又积累了一个网络流模型:最大权闭合子图,相关证明去看论文,感觉自己不是很懂证明,但现在还是先把建模记下来再说吧 枚举一个点,硬点它一定要被选中,那么以它为根,如果选了$x$就必须要选$fa_x$,这就 ...
- 【堆】bzoj1293 [SCOI2009]生日礼物
考虑poj3320尺取法的做法,与此题基本一样,但是此题的 位置 的范围到2^31 尺取法不可. 将每种珠子所在的位置排序. 每种珠子要维护一个指针,指到已经用到这个种类的哪个珠子. 所以尺取法用堆优 ...
- Exercise02_09
import javax.swing.JOptionPane; public class Acceleration { public static void main(String[] args){ ...
- Using Dtrace OEL 6.X and Oracle® Solaris 11.3 DTrace (Dynamic Tracing) Guide
http://www.hhutzler.de/blog/using-dtrace/ https://docs.oracle.com/cd/E53394_01/html/E53395/gkyaz.htm ...
- Word绘制跨行表格
如图“用户评价电影数目”,我们需要均分第一行,选中这三个个,设置了表个高度0.5cm,但是发现上面的一个比较考上,我们需要找到水平竖直居中,那么双击表格,打开表格工具,有设计和布局,切换到布局就找到了 ...
- 'dict_values' object does not support indexing, Python字典dict中由value查key
Python字典dict中由value查key 众所周知,字典dict最大的好处就是查找或插入的速度极快,并且不想列表list一样,随着key的增加越来越复杂.但是dict需要占用较大的内存空间,换句 ...
- 【转载】【Todo】Nodejs的优缺点
Nodejs的优缺点,这里面讲的比较详细.有时间可以多看看别人的分析. https://www.zhihu.com/question/19653241 Node.js 的架构与 Django, Rai ...
- pymongo增删查改以及条件查询
---恢复内容开始--- 下载Pymongo pip install pymongo pip install pymongo==x.x.x指定下载版本 连接数据库 from pymongo impor ...
- win7系统下ping不是内部或外部命令
win7下ping不是内部或外部命令,在使用java设置变量环境时,可能会遇到这样的问题,出现win7下ping不是内部或外部命令,是在设置变量环境是把一些设置删掉了的原因,请看在win7下怎么还原. ...