图片延迟加载(lazyload)的实现原理

此前在浏览一些网站的时候,发现他们网站的图片都是你“鼠标”滚到哪,图片才会加载显示。当时觉得好神奇,怎么会这么“跟手”呢。在学习JS和jQuery后,自己尝试写了能够实现lazyload的方法。核心原理是:1 设置一个定时器,计算每张图片是否会随着滚动条的滚动,而出现在视口(也就是浏览器中的 展现网站的空白部分 )中;2 为img标签设置一个暂存图片URL的自定义属性(例如loadpic),当图片...
图片延迟加载 lazyload

关于鼠标事件的screenY,pageY,clientY,layerY,offsetY属性 (详细图解)

screenY鼠标相对于显示器屏幕左上角的偏移pageY鼠标相对于页面左上角的偏移 (其值不会受滚动条的影响)IE9之下并不支持这个属性但是可以写点代码计算出来。 jQuery中的实现://CalculatepageX/YifmissingandclientX/Yavailable if(event.pageX==nulloriginal.clientX!=null){ eventDoc=ev...
鼠标事件

通过javascript判断浏览器类型

javascript代码:functiongetOs(){ varOsObject=; if(navigator.userAgent.indexOf(MSIE)0){ returnMSIE; } if(isFirefox=navigator.userAgent.indexOf(Firefox)0){ returnFirefox; } if(isSafari=navigator.us...
浏览器类型 javascript

JavaScript的隐式类型转换浅析

JavaScript的数据类型分为六种,分别为null,undefined,boolean,string,number,object。object是引用类型,其它的五种是基本类型或者是原始类型。我们可以用typeof方法打印来某个是属于哪个类型的。不同类型的变量比较要先转类型,叫做类型转换,类型转换也叫隐式转换。隐式转换通常发生在运算符加减乘除,等于,还有小于,大于等。。typeof11//str...
隐式类型 JavaScript

JavaScript人脸检测的实现方法

今天,我们开始学习tracking.js,它是一个由Eduardo Lundgren开发的轻量级的javascript库,它可以让你做实时的人脸检测,色彩追踪和标记好友的脸。在这个教程中,我们将会看到,我们如何从静态图片中检测脸,眼睛和嘴巴。我一直对视频和图片中的人脸标记、检测和人脸识别技术很感兴趣。尽管我知道获取逻辑和算法去开发人脸识别软件或者插件已经超出了我的想象。当我知道Javascript...
JavaScript 人脸检测

编写更加稳定、可读性强的JavaScript代码

每个人都有自己的编程风格,也无可避免的要去感受别人的编程风格——修改别人的代码。”修改别人的代码”对于我们来说的一件很痛苦的事情。因为有些代码并不是那么容易阅读、可维护的,让另一个人来修改别人的代码,或许最终只会修改一个变量,调整一个函数的调用时机,却需要花上1个小时甚至更多的时间来阅读、缕清别人的代码。本文一步步带你重构一段获取位置的”组件”——提升你的javascript代码的可读性和稳定性。...
JavaScript代码

编写更加稳定/可读的javascript代码

每个人都有自己的编程风格,也无可避免的要去感受别人的编程风格——修改别人的代码。修改别人的代码对于我们来说的一件很痛苦的事情。因为有些代码并不是那么容易阅读、可维护的,让另一个人来修改别人的代码,或许最终只会修改一个变量,调整一个函数的调用时机,却需要花上1个小时甚至更多的时间来阅读、缕清别人的代码。本文一步步带你重构一段获取位置的组件——提升你的javascript代码的可读性和稳定性。本文内容...
javascript javascript代码

通过Web AudioAPI可视化输出MP3音乐频率波形

Audio 组件首先我们需要创建一个audio组件,通过预加载(preloading)和流式(streaming)播放时时处理.创建Audio上下文ContextAudioContext是Web Audio API的基石,我们将创建一个全局的AudioContext对象,然后用它线性处理字节流./*创建一个AudioContext*/ varcontext; /*尝试初始化一个新的AudioC...
MP3音乐频率 Web AudioAPI

通过终端调试 AngularJS 应用

当我们构建AngularJS应用时,通过浏览器(如Chrome,Firefox和IE)的JavaScript控制台访问应用中隐藏的数据和服务总会有些困难。下面是一些简单的技巧可以帮助我们通过Javascript控制台来查看或者控制正在运行的Angular应用,使得应用可以比较容易进行测试,修改,甚至实时的修改我们的Angular应用:1: 访问作用域通过一行简单的JS程序访问页面中任何作用域(甚至...
AngularJS 终端调试

使用time.js格式化时间戳

社交网络有各种 Feed ,每个feed有其对应的时间,比如如下的场景:还有如下的场景:废话不多说,反正这种事件处理用 time.js 处理,就非常合适不过啦。引入 time.js 后,会得到一个 Time 的方法,你可以这样使用它:javascript vartime=1422875526971; Time(time,%y年%M月%d日%h时%m分%s秒);//xxxx年xx月xx日xx时x...
time.js 时间戳