“JS实例”目录存档

小tip:iframe高度动态自适应

2010年12月7日,星期二

我从来对iframe就没有什么好感,对其基本上是不屑一顾。但是人在江湖,身不由己。经理发话,新功能使用iframe实现,没办法,只好折腾,其中麻烦的是高度自适应的问题。后来,参考国外一些实现方法,根据原理提炼出了一个比较简单通用可行的方法。作为小小tip展示下,做备忘用。

本文内容不算多,但是该有的demo还是有的,该有的代码展示也是有的,有必要的截图。总之,希望能对您的学习提供帮助。

阅读全文…

js页面滚动时层智能浮动定位实现(jQuery/MooTools)

2010年11月11日,星期四

关于层的智能浮动效果早在几年前我就在国外的一些个人网站的垂直导航上见到了,现在似乎在国内一些商业网站上也屡见此效果,例如淘宝网的搜索结果页的排序水平条,在默认状态下,滚动条跟随页面滚动,随着页面向下滚动,当此水平条接触浏览器的上边缘时,水平条独立出来,不跟随滚动条滚动了。类似的效果在新浪微博上也有,页面滚动,新动态提示开始要淡出浏览器窗口的时候,其浮动于浏览器窗口的最上沿显示,此效果实现原理其实很简单,本文就将展示其在jQuery和MooTools下的实现。提供代码以及demo效果展示,希望能对您的学习有所帮助。

阅读全文…

js下拉菜单实现与可访问性问题的一些思考

2010年09月10日,星期五

从本文的题目可以看出,内容的重点在于“下拉菜单”“可访问性”,其实前面的“下拉菜单”只是用来示例,“可访问性”才是本文的重点。本文就页面的“可访问性”讲了很多。一如既往,丰富的截图,必要的代码示例,还有UI良好的demo页面。天色已晚,话不多说,总之,应该会对您的学习有所帮助的。

阅读全文…

js+flash(as3)实现复制文字内容到剪切板

2010年08月17日,星期二

单纯的js复制文字到剪切板较啰嗦,由于考虑到安全性等原因,使用类似点击按钮这类复制文字内容的操作往往多有限制,所以,总的来看,使用js实现文字等内容的复制不是个好方法。既然,js实现文字的复制有点啰哩吧嗦的,我们可以转向其他的方法,例如JavaScript的近亲,ActionScript,在AS3下,实现文字复制到剪切板要比js轻松很多。本文就是介绍如何通过flash为媒介实现将web页面上的文字复制到剪切板中。
提供代码展示,提供demo页面,提供源文件打包下载,希望能对您的学习有所帮助。

阅读全文…

团购类网站倒计时的js实现

2010年07月27日,星期二

本文内容很简单,就是展示下如何使用js脚本实现倒计时效果。倒计时效果在团购类网站上可谓必须确定以及肯定会有的,如今团购网站如雨后春笋,一个接一个的冒出来,所以,这类前端效果还是有些实用价值的,故有此文,希望对有需要的同行们提供些帮助。

外甥点灯笼——照旧,有截图,有demo,有代码展示,以及提供必要的文件下载。

阅读全文…

图片旋转+剪裁js插件(兼容各浏览器)

2010年05月6日,星期四

在现在的web应用中,对上传的图片,例如头像,原始的摄影照片常常需要在web页面上进行一些处理,常见的处理就是剪裁与旋转。但是,似乎就目前而言,缺少即支持剪裁又支持旋转且轻量级的js插件。于是,我就抽时间写了个简单的插件。

兼容各个浏览器,使用canvas元素实现旋转,封装良好,希望能对您有所帮助。

阅读全文…

纯js无图片无外链CSS图片幻灯片播放插件

2010年05月5日,星期三

美女 张鑫旭-鑫空间-鑫生活
本文展示我自己写的极轻量级的图片幻灯片播放的插件js,无外链图片,无外链CSS,兼容性性效果俱佳,无需调用外部的库,可谓大图幻灯片播放之首选。
本文提供demo,源文件下载,以及使用示例,希望能对您有所帮助。

阅读全文…

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

2010年04月14日,星期三


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

阅读全文…

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

2010年04月14日,星期三

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

阅读全文…

JavaScript实现最简单的拖拽效果

2010年03月24日,星期三

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

阅读全文…