“JS相关”目录存档

jQuery – 高亮动态显示页面HTML代码插件

2010年04月23日,星期五

我经常思考如何更加清晰的表述自己的观点,所以我会截图、会制作动画,甚至会录制视频,当然demo也是必不可少的。但是,有时候,我们想要看到的不只是现象,更要直观地看到内部的代码运作,例如,我们学习jQuery的外部插入方法,节点删除这类DOM操作时,看到HTML节点代码的变化是最直观的了;还有,也是更加必要的,就是在js功能调试的时候,有时候,我们要修改一个表单的name值,但是修改与否,页面上是显示不出来的,但是如果可以窥见HTML代码,那就很赞了。

所以我决定写一个可以高亮动态显示HTML片段的插件,方便调试与演示。本文提供详细的演示与讲解,以及源文件下载,希望能对您的学习有所帮助。

阅读全文…

新浪微博插入话题后部分文字选中的js实现

2010年04月14日,星期三


在新浪微博的微博信息发布框下面,有个“话题”按钮,点击这个“话题”文字按钮后,在输入框文本域里面就会添加一段文字“#请在这里输入自定义话题#”,其中“请在这里输入自定义话题”处于被选中的状态,这样用户无需再选中文字,直接敲键盘就可以替换这部分内容,这是非常好的一个提高用户体验的细节。
本文就像详尽的讲解这种效果的实现,提供详尽的代码展示,必要的截图,以及demo示例页面,希望能对您的学习有所帮助。

阅读全文…

JavaScript实现http地址自动检测并添加URL链接

2010年04月14日,星期三

给http字符自动添加URL链接是比较常见的一项功能。本文主要讲解如何使用JavaScript实现URL地址自动添加链接的实现。略微展开讲述了JavaScript正则表达式的一些概念。内容虽小,讲解甚细。
本文提供丰富的代码示例,提供详尽的页面截图,以及必要的demo测试页面,希望能对您的学习有所帮助。

阅读全文…

JavaScript实现最简单的拖拽效果

2010年03月24日,星期三

本文用非常简洁的代码展示了如何用JavaScript实现元素的拖拽效果。本文拖拽js代码封装良好,使用方便,效果也不错,相信可以对一些初学者给予不小的帮助,另外提供必要的插图,代码展示,demo页面及文件下载,希望对您的学习有所帮助。

阅读全文…

自己写的无图片版jQuery zxxbox弹出框插件

2010年03月22日,星期一

jQuery zxxbox 插件截图 张鑫旭-鑫空间-鑫生活
虽然市面上的facebook效果的boxy弹出层插件不少,但是普遍文件较大,而且还需要调用额外的图片链接(不止一个,还有半透明渲染)以及CSS文件。对于我这样很注意文件大小优化的人来说是无法容忍的,趁着这次学习jQuery的一些知识,我就花了一些时间写了款jQuery插件,我将其命名为zxxbox弹出框插件,非常小巧,使用方便,无额外的CSS或是图片调用,能满足大部分的弹出框效果功能,可以说从效果上讲,也是一款很不错的jQuery插件。
本文详细介绍词插件的使用方法,提供必要的demo,提供原始文件下载,希望能对您有所帮助。

阅读全文…

让所有浏览器支持HTML5 video视频标签

2010年03月17日,星期三

HTML5 video标签可以让视频如同图片那样使用一个标签就可以轻轻松松地嵌入到页面上,然而目前只有Safari之类的浏览器支持,主流的IE浏览器是路边的电线杆——靠边站。然而,优秀的技术先驱们,发动他们的智慧,通过一个js,实现了所有浏览器下都可以使用video标签,本文就是将如何使用使得所有的主流浏览器都支持HTML5 video标签,提供必要的截图,提供demo页面,提供原JavaScript文件下载,希望能对您的学习有所帮助。

阅读全文…

JS HEX十六进制与RGB, HSL颜色的相互转换

2010年03月12日,星期五

本文逐层深入,讲述使用JavaScript对HTML与CSS中的颜色值表示方法(十六进制形式与RGB形式)之间的进行相互的转化。提供必要的插图,提供demo以及源文件下载,希望能对您有所帮助。

阅读全文…

jQuery Pagination Ajax分页插件中文详解

2010年01月31日,星期日


看标题就应该知道本文的内容了,没错,我对jQuery Pagination Ajax分页插件项目页面做了中文翻译,其中还做了新的中文首页,其他的话就不说了,总之,相信会对您的学习有所帮助的。

阅读全文…

jQuery Lightbox(balupton版)图片展示插件讲解

2010年01月17日,星期日

插件效果截图

jQuery Lightbox(balupton版)图片展示插件可以说是最优秀的lightbox效果的图片上一个下一个图片切换显示插件,没有之一。我将其原项目进行了翻译,自己进行了一系列的测试,并对原js文件一些英文内容替换成了中文,修改部分CSS文件代码使更符合中文的显示。

本文提供此插件详尽的概述,提供源文件下载,配合demo页面,相信一定会对您对这款插件的掌握有所帮助的。

阅读全文…

jQuery-两款不同原理的圆角插件讲解

2010年01月6日,星期三

本文介绍两款原理完全不同的jQuery圆角插件,一个是jquery.corners.js插件,还有一个是jquery.corner.js插件,两个相差一个”s”,但是内部核心方法差异却很大,一个是使用canvas标签,另外一个则用div标签一个一个摞起来的。
另外,本文还会对每一款插件做讲解,包括其使用方法,实现的原理,注意的问题等。每款均提供demo页面与相关源文件下载。文章最后还总结了各个插件的优缺点等,总之,希望能对您对圆角的学习和认识有所帮助。

阅读全文…