CssRain-前端技术

jQuery插件—PressEnter.

今天在http://blog.cnseven.net/?p=63上面看到的。
总是需要捕捉回车按下的事件，每次单独处理也挺麻烦的，干脆做了个插件。
cnseven的写法是：
jQuery.fn.extend({
pressEnter: function(fun){
var $obj = $(this);
$obj.keypress(function(e){
e = e || window.event;
var keyCode = e.keyCode ? e.keyCode : e.which ? e.which : e.charCode;
if(keyCode==”13″) {
fun();
}
});
}
});
调用：
$(function(){
$(“#Password”).pressEnter(function(){
alert(“CssRain.cn”);
});
})

很明显，这样写第一没体现jquery的优势，第二语法上还有点问题。
我写的：
jQuery.fn.extend({
pressEnter: function(fun){
this.keypress(function(e){
if(e.which==”13″){
fun();
}
});
}
});
PS：
在插件里，this 就是代表jquery对象， 所以不需要再封装。
event 和 event.which jQuery都已经帮我们做了处理，所以也不要再自己处理。

jQuery插件—Boxy(Facebook-like dialog).

演示：

http://onehackoranother.com/projects/jquery/boxy/tests.html

jQuery—虚拟键盘.

演示：

http://www.designshack.co.uk/tutorialexamples/vkeyboard/

下载：
http://www.designshack.co.uk/tutorialexamples/vkeyboard/vkeyboard.zip

jQuery插件—圆角插件(corners).

[code]

[/code]
演示：

http://www.atblabs.com/jquery.corners.html

下载：

http://plugins.jquery.com/project/corners

More 圆角：

http://www.lesliesommer.com/wdw07/html/

http://www.cssplay.co.uk/boxes/chunky.html

jQuery插件—EveryTime.

jQuery timers is an attempt to combine jQuery's concise chaining programming style with the awkward style in which timed events are coded in JavaScript to produce a friendlier and more intuitive timed event system.
[code]$("p", demos).everyTime(1000,function(i) {
$(this).html(i);
});[/code]
演示：

http://jquery.offput.ca/every/

jQuery插件—按需加载JavaScript和CSS.

jQuery插件—按需加载JavaScript和CSS.
这个插件可以按你的需要加载javascript和css文件，
也就是你不用在文件开始的时候就加载所有的js和css文件，
加快文件在客户端的载入速度，
用法：
1 , 当在需要的时候再加载所需的javascript和css文件。
$.include('file/test.js')或$.include('file/test.css')
2, 当然若你一次想加载多个文件你也可以这样写:
$.include(['file/test.js','file/test.css'])。
3, 因为这两个文件的路径相同，所以可以先指定路径再加载所有文件：
$.ImportBasePath = 'file/';
$.include(['test.css','test.js']);
4, 你还可以加载完文件后执行回调函数
$.include(“file/test.css”,function(){
alert(“加载css后执行”);
});
看个例子吧：

http://www.94this.com.cn/myCode/jqueryIncludefile/demo3.html

转：http://www.94this.com.cn/article/251.htm

jQuery插件—跟随滚动条同步滚动的侧边栏.

代码：
[code] [/code]
演示：

http://kitchen.net-perspective.com/sf-example-1.html

http://kitchen.net-perspective.com/sf-example-2.html

http://kitchen.net-perspective.com/sf-example-3.html

http://kitchen.net-perspective.com/sf-example-4.html

下载：

http://kitchen.net-perspective.com/open-source/scroll-follow/

jQuery插件—Cursor Message(跟随鼠标的提示信息)。

 

这个是即时提示的一个插件，当你在input里输入文字时会有相关的提示，当然了，既然是jquery插件，使用起来当然很简单。
$.cursorMessage(message [, options] );
看看简单吧！下面详细说明一下：
message:当然是提示的文字咯！
options:可以有三个，都是可选的。
  offsetX  提示出现的位置和鼠标光标在x轴的距离默认为5
  offsetY   这个不用我说也明白了吧
  hideTimeout  从提示出现到消失间隔的时间
好了！看看效果
我想这个可以用在表单的检测上，可以让浏览者在填写的时候就提示他填写的是否正确。
看这个演示

 

转：http://www.94this.com.cn/article/248.htm

jQuery插件—Clipboard Copy(复制)。

这个插件是用来把页面的内容复制到剪贴板的插件，使用起来很简单。
$.copy("字符串")     // 把字符串复制到剪贴板
$.copy(varStr)     // 把变量varStr的值复制到剪贴板
$("#elmID").copy()           // 复制id为elmID的节点里的文字
$("#elmID input").copy()     // 复制id为elmID的节点下所有input的值
$("#elmID input").copy("|") // 复制id为elmID的节点下所有input的值，并以“|”隔开
好了，看看演示的效果吧！