本身属于翻译文章,内容为JavaScript的一些奇怪之处,但是又不是传统意义上的逐字逐句地翻译,大体意思到了,至于细节以及文字表述还是有些本土化的特征,并在有些地方外加了点自己的小看法。同时为了便于大家的理解与学习,我还对原文内容进行了扩充,即基本上针对每一个实例都制作了相应的demo页面并附上了相关的截图。希望能对您的学习有所帮助。
“JS相关”目录存档
翻编-JavaScript有关的10个怪癖和秘密
2011年06月21日,星期二基于HTML5 audio元素播放声音jQuery小插件
2011年04月28日,星期四在我浮生如梦的大学那会儿,貌似flash网站还有点小火,且大凡有点含量的flash站点上,杂七杂八的音效总是少不了。一部分音效是烘托渲染气氛的背景音乐,另外一部分就是促进互动,增强体验的交互声音,例如按钮按下或者是经过时“哔哔”声或是“叭叭”声。而在那个时候,在远离flash的web页面上鲜有声音的交互,即使有,要想实现兼容性,要不借助控件,要不还是通过与flash交互实现。
随着HTML5的推进与普及,很多以前要借助flash才能实现的效果现在可以很轻松地在网页上实现了。例如音频文件的播放。而本文就折腾点小名堂,让jQuery下轻松实现元素hover时播放声音的效果,基于HTML5 audio元素。
外甥打灯笼——照旧,有demo页面,有源文件下载和源代码展示。总之,希望本文的内容能够对您的学习有所帮助。
MooTools下简易自定义滚动条小插件
2011年04月18日,星期一由于jQuery自身没有wheel事件滚轮事件,懒得折腾,所以这里只写了MooTools库下是简易自定义滚动条。此自定义滚动效果比较简单,就点击滚动条拖移和鼠标滚轮滚动两个效果。
本文提供必要的demo页面以及源代码下载,另外简单展示了该小插件的使用,并分析了其一些不足和适用情况,内容相对较少。总之,希望本文的内容能够对您的学习有所帮助。
仿新浪微博返回顶部的js实现(jQuery/MooTools)
2011年04月7日,星期四在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮。本文就将简单展示下这种效果,本文的效果参照新浪微博的返回顶部效果,展示了在jQuery库和MooTools库下的实现。本文提供必要的demo页面和源代码展示。希望本文的内容能够对您的学习有所帮助。
js页面文字选中后分享到新浪微博实现
2011年02月12日,星期六正是微博如火如荼的时节,其中各个微博的分享功能是网站推广产品的好东东啊,此时如何方便快捷的使用微博的分享功能就显得比较重要了。
一般翻译软件都有划词翻译功能,启用后,随便选中那个软件的一段文字,就会出现类似这样子的浮动提示框。
在web页面上,我们也是可以实现类似的效果的:划词→显示提示→分享。这样子,我们就可以轻松地将页面上的内容分享到新浪微博这些微博网站上了。
本文提供demo页面,提供源代码展示,必要的截图。总之,希望能对您的学习有所帮助。
HTML5 drag & drop 拖拽与拖放简介
2011年02月9日,星期三本文简单介绍了下利用HTML5 drag & drop API非常简单轻松地实现拖拽与拖放效果。提供一些关键术语的讲解,提供简单实用的demo页面,提供必要的源代码展示和效果截图。总之,希望能对您的学习有所帮助。
js面向数据编程(DOP)一点分享
2011年01月18日,星期二面对数据编程(data-oriented-programme)这个概念第一次接受是在前年阿里巴巴举行的D2前端论坛上,来自Baidu金大为:《模板语言与大前端》的分享,面对数据编程在处理大数据量交互的情况下非常好用,性能高,维护方便,思路简单清晰,不易出bug。本文还是那样,讲讲废话,举举例子,画画图,展示下代码,写个pp的demo页面,中间再插几个冷笑话。不是什么高深的东西,比我还懂的人大把大把,这里算是点自我总结,是自我提高,也希望能对跟我一样js新人提供些帮助。
jQuery powerFloat万能浮动层下拉层插件
2010年12月16日,星期四本文就是介绍自己最近一直在整的一款jQuery插件,名为powerFloat,中文名为万能浮动层插件。顾名思意就是可以实现基本上一切与某元素有位置关系的浮动效果。插件虽然强大,但是考虑到API的精炼,虽然制定了不少特殊的规则,所以此插件在学习成本上比一般的插件要高一点。这也是为何本文的内容会比较长的原因。其他就不多说了,虽然王有婆卖瓜的味道,但是我还是要说这个插件还是挺不错的。如果您对其中的规则都熟悉的话,会对您开发制作页面有很大的帮助的。主要是省掉了很多的功夫。
小tip:iframe高度动态自适应
2010年12月7日,星期二我从来对iframe就没有什么好感,对其基本上是不屑一顾。但是人在江湖,身不由己。经理发话,新功能使用iframe实现,没办法,只好折腾,其中麻烦的是高度自适应的问题。后来,参考国外一些实现方法,根据原理提炼出了一个比较简单通用可行的方法。作为小小tip展示下,做备忘用。
本文内容不算多,但是该有的demo还是有的,该有的代码展示也是有的,有必要的截图。总之,希望能对您的学习提供帮助。