<![CDATA[风之相随'S BLOG - JavaScript]]> http://www.windsfly.cn/blog/ zh-cn PBlog2 v2.4 风之相随'S BLOG http://www.windsfly.cn/blog/images/logos.gif http://www.windsfly.cn/blog/ 风之相随'S BLOG http://www.windsfly.cn/blog/default.asp?id=1976 <![CDATA[CSS+div和JS制作的网页滑动门特效代码]]> sf223cn@yahoo.com.cn(admin) Sat,14 Aug 2010 15:24:49 +0800 http://www.windsfly.cn/blog/default.asp?id=1976
HTML代码


[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
]]> http://www.windsfly.cn/blog/default.asp?id=1975 <![CDATA[银灰色tab带链接的jquery滑动门代码]]> sf223cn@yahoo.com.cn(admin) Sat,14 Aug 2010 15:19:07 +0800 http://www.windsfly.cn/blog/default.asp?id=1975 http://www.duice.net/UploadFiles/wzjs/wytx/hdm/hdm13.html

程序代码 程序代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>银灰色tab带链接的jquery滑动门代码演示www.duice.net</title>
<style rel="stylesheet" type="text/css">
/*通用样式*/
html,body,div,p,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,object,iframe,form,blockquote,fieldset,input,textarea,code,address,caption,cite,code,em,i,ins{margin:0;padding:0;font-style:normal;font-size:12px;}
ul,ol,dl,dt,dd{list-style:none;}
body{background:#fff;font-family:"宋体", Arial, Helvetica, sans-serif}
.wrap{width:950px;margin:0 auto;overflow:hidden}
div.tabzone{width:308px;margin:10px 10px;float:left}
.content{padding:10px;}
.hdm01,.hdm02{height:250px;background-color:#f9fafc;border:1px solid #d3ddeb;border-top-color:#d3ddeb;}
.hdm01 h3,.hdm02 h3{height:35px;background:url(h_norepeat.png) no-repeat 0 -38px;}
.hdm01 h3 a,.hdm02 h3 a{width:102px;height:35px;line-height:32px;display:block;float:left;color:#333!important;text-align:center;font-weight:normal; text-decoration:none;}
.hdm01 h3 a.current,.hdm02 h3 a.current{background:url(h_norepeat.png) no-repeat 2px -1px; font-weight:bold; font-size:14px; position:relative}

</style>
<script type="text/javascript" src="jquery.js"></script>
</head>

<body>
<div class="wrap">

<div class="hdm01 tabzone">
<h3><a href="http://www.duice.net/html/list_620.html" target="_blank">零度对策</a><a href="http://www.duice.net/html/list_620.html" target="_blank" class="midd">网页特效</a><a href="http://www.duice.net/html/list_620.html" target="_blank">网络营销</a></h3>
<div class="content">零度对策，中小企业网络营销专家</div>
<div class="content" style="display:none;">提供最齐全实用的网页特效代码 </div>
<div class="content" style="display:none;">最权威的网络营销教程发布</div>
</div>

<div class="hdm02 tabzone">
<h3 ><a href="http://www.duice.net/html/list_620.html" target="_blank">博客营销</a><a href="http://www.duice.net/html/list_620.html" target="_blank" class="midd">网站优化</a><a href="http://www.duice.net/html/list_620.html" target="_blank">网站推广</a></h3>
<div class="content">提供博客大巴模板、博客营销教程与技巧。</div>
<div class="content" style="display:none;">专业团队提供百度与谷歌的搜索引擎优化。</div>
<div class="content" style="display:none;">专业的网站推广服务，没有效果不收费。</div>
</div>

<div style="clear:both; margin:20px"><script type="text/javascript">
var _bdhmProtocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cscript src='" + _bdhmProtocol + "hm.baidu.com/h.js%3Ff660b2f891e56c46ea74e2e8077357e7' type='text/javascript'%3E%3C/script%3E"));
</script>
</div>
</div>
</div>
<script>
jQuery(function() {
jQuery('.hdm01>h3>a').mouseover(function() { TabSelect(".hdm01>h3>a", ".hdm01>div.content", "current", jQuery(this)) });
jQuery('.hdm01>h3>a').eq(1).trigger("mouseover");
jQuery('.hdm02>h3>a').mouseover(function() { TabSelect(".hdm02>h3>a", ".hdm02>div.content", "current", jQuery(this)) });
jQuery('.hdm02>h3>a').eq(1).trigger("mouseover");
jQuery('#duice').click(function(){
            jQuery('.wthpop').show();
        })
        jQuery('.wthpop>p>span').click(function(){
            jQuery('.wthpop').hide()
        })

    });

//tab function
function TabSelect(tab,con,addClass,obj) {
    var jQuery_self = obj;
    var jQuery_nav = jQuery(tab);

    jQuery_nav.removeClass(addClass),
    jQuery_self.addClass(addClass);

    var jQuery_index = jQuery_nav.index(jQuery_self);
    var jQuery_con = jQuery(con);
    jQuery_con.hide(),
    jQuery_con.eq(jQuery_index).show();
}
</script>

</body>
</html>

]]> http://www.windsfly.cn/blog/default.asp?id=1974 <![CDATA[同一个页面设置多个滑动门]]> sf223cn@yahoo.com.cn(admin) Sat,14 Aug 2010 15:02:05 +0800 http://www.windsfly.cn/blog/default.asp?id=1974 http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>滑动门</title>
<style media="screen" type="text/css">
<!--
*{font-size:12px;}
html,body{margin:0;text-align:center;over-flow:hidden;height:100%;width:100%;}
UL{list-style-type:none; margin:0px;}
/* 标准盒模型 */
.ttl{height:18px;}
.ctt{height:auto;padding:6px;clear:both;border:1px solid #064ca1;border-top:0;text-align:left;}
.w936{margin:2px 0;clear:both;width:240px;/*滑动门的宽度*/}
/* TAB 切换效果 */
.tb_{background-image: url('http://www.pub.work.zjol.com.cn/ttxw/ztxl/gb/images/tb1.gif'); background-repeat: repeat-x;background-color: #E6F2FF;}
.tb_ ul{height:24px;}
.tb_ li{float:left;height: 24px;line-height:1.9;width: 80px;cursor:pointer;}
/* 控制显示与隐藏css类 */
.normaltab   { background-image:url('http://www.pub.work.zjol.com.cn/ttxw/ztxl/gb/images/tb2.gif'); background-repeat: no-repeat; color:#1F3A87 ;}
.hovertab    { background-image: url('http://www.pub.work.zjol.com.cn/ttxw/ztxl/gb/images/tb3.gif'); background-repeat: no-repeat; color:#1F3A87;

font-weight:bold }
.dis{display:block;}
.undis{display:none;}
-->
</style>
<script type="text/javascript" language="javascript">
//<!CDATA[
function g(o){return document.getElementById(o);}
function HoverLi(n){
//如果有N个标签,就将i<=N;
for(var i=1;i<=3;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab';
}
function OutHover(n)
{
g('tb_'+n).className='normaltab';
}
function HoverLi2(n)
{
for(var i=4;i<=6;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab';
}
//如果要做成点击后再转到请将<li>中的onmouseover 改成 onclick;
//]]>
</script>
</head>
<body>
<div class="w936">
<div id="tb_" class="tb_">
   <ul>
    <li id="tb_1" class="hovertab" onmouseover="HoverLi(1);" onmouseout="OutHover(1)">
    国内新闻</li>
    <li id="tb_2" class="normaltab" onmouseover="HoverLi(2);" onmouseout="OutHover(2)">
    国际新闻</li>
    <li id="tb_3" class="normaltab" onmouseover="HoverLi(3);" onmouseout="OutHover(3)">
    图说新闻</li>
   </ul>
</div>
<div class="ctt">
  <div class="dis" id="tbc_01">这里是ASP.NET的相关内容</div>
  <div class="undis" id="tbc_02">这里是MYSQL的相关内容</div>
  <div class="undis" id="tbc_03">这里是DELPHI的相关内容</div>
</div>
</div>
<div class="w936">
<div id="tb_" class="tb_">
   <ul>
    <li id="tb_4" class="hovertab" onmouseover="HoverLi2(4);" onmouseout="OutHover(4)">
    国内新闻</li>
    <li id="tb_5" class="normaltab" onmouseover="HoverLi2(5);" onmouseout="OutHover(5)">
    国际新闻</li>
    <li id="tb_6" class="normaltab" onmouseover="HoverLi2(6);" onmouseout="OutHover(6)">
    图说新闻</li>
   </ul>
</div>
<div class="ctt">
  <div class="dis" id="tbc_04">这里是ASP.NET的相关内容</div>
  <div class="undis" id="tbc_05">这里是MYSQL的相关内容</div>
  <div class="undis" id="tbc_06">这里是DELPHI的相关内容</div>
</div>
</div>
</body>
</html>]]> http://www.windsfly.cn/blog/default.asp?id=1973 <![CDATA[发一段滑动门的代码，简洁易改，一个页面可以放多个滑动门]]> sf223cn@yahoo.com.cn(admin) Sat,14 Aug 2010 14:57:35 +0800 http://www.windsfly.cn/blog/default.asp?id=1973

超实用通用滑动门代码，一个页面多个滑动门代码，简洁滑动门特效代码--------演示地址及下载地址：http://www.zhnao.com/download/huadongmen.html

这段css代码是控制滑动门属性的地方，如果要更换背景图片，或者滑动门尺寸大小，找到相应的代码修改即可。这是css代码：

<!--
body{margin:0px;padding:0px;font-size:12px;line-height:20px;}
.t_rt{text-align:right;}
ul,li{margin:0px;padding:0px;list-style-type:none;}
.preview{margin:10px;padding:10px;overflow:hidden}
.cont{padding:10px;}
.cls{clear:both;}
.hidden{display:none;}
#sourse{border:1px dotted #DEFAE6;width:600px;height:300px;margin:0px auto;}
.textDiv{margin:10px 40px 10px;text-align:center;}
.example{margin:10px;background:#FFF;border:1px dotted #ADDA9C;padding:10px;}
.scrolldoorFrame{width:326px;margin:0px auto;overflow:hidden;border:1px solid #e3e3e3;}
.scrollUl{width:326px;overflow:hidden;height:23px; border-bottom:#e3e3e3 solid 1px; background-image:url(images/btn_1.gif);}
.scrollUl li{float:left}
.bor03{border-top-width:0px;}
.st01{cursor:pointer; background-image:url(images/btn_2.gif);font-weight:bold; width:108px; text-align:center; color:#fff; height:23px; line-height:23px}
.st01 a{ color:#fff; text-decoration:none}
.st02{cursor:pointer;width:108px;text-align:center;height:23px; line-height:23px}
-->
——————————————————————————————————————————————————————分割线

如果增加滑动门，需要复制一部分属性，然后修改相对应代码，需要复制的css名有以下几个：

.scrolldoorFrame_1
.scrollUl_1
.scrollUl_1 li
.st01_1
.st01_1 a
.st02_1
.st05
.st05_hover

——————————————————————————————————————————————————————分割线

这是控制效果的js代码，复制过去就ok，添加的话需要改动的也就是最下面的那几行，后面有注释，添加时复制即可，当然也要修改id：

<script type="text/javascript">
function switchmodTag(){
}
switchmodTag.prototype = {
st : function(menus,divs,openClass,closeClass){
  var _this = this;
  if(menus.length != divs.length)
  {
   alert("菜单层数量和内容层数量不一样!");
   return false;
  }    
  for(var i = 0 ; i < menus.length ; i++)
  {
   _this.$(menus[i]).value = i;    
   _this.$(menus[i]).onmouseover = function(){//如果想把效果变成点击切换，将此行onmouseover 改成onclick即可。
    
    for(var j = 0 ; j < menus.length ; j++)
    {      
     _this.$(menus[j]).className = closeClass;
     _this.$(divs[j]).style.display = "none";
    }
    _this.$(menus[this.value]).className = openClass;
    _this.$(divs[this.value]).style.display = "block";    
   }
  }
  },
$ : function(oid){
  if(typeof(oid) == "string")
  return document.getElementById(oid);
  return oid;
}
}
window.onload = function(){
var STmodel = new switchmodTag();
STmodel.st(["a_1","a_2","a_3"],["c1_1","c1_2","c1_3"],"st01","st02");//第一组动滑轮
STmodel.st(["b_1","b_2","b_3","b_4","b_5"],["c2_1","c2_2","c2_3","c2_4","c2_5"],"st01","st02");//第二组动滑轮
STmodel.st(["c_1","c_2","c_3","c_4","c_5"],["c3_1","c3_2","c3_3","c3_4","c3_5"],"st01","st02");//第三组动滑轮
STmodel.st(["d_1","d_2","d_3","d_4","d_5"],["c4_1","c4_2","c4_3","c4_4","c4_5"],"st01","st02");//第四组动滑轮
//如需增加滑动门个数，请复制代码，ID命名规则如上即可。
}
</script>
——————————————————————————————————————————————————————分割线

这就是html代码了：

<h5>一.如果想把效果变成点击切换，将JS代码中做标记的行onmouseover 改成onclick即可</h5>
<h5>二.如果想增加滑动门个数，请查看JS代码中做标记的地方，ID命名规则如上即可</h5>
<div class="preview">
  <div class="scrolldoorFrame">
   <ul class="scrollUl">
    <li class="st01" id="a_1"><a href="http://www.zhnao.com">新闻</a></li>
    <li class="st02" id="a_2"><a href="http://www.zhnao.com">财经</a></li>
    <li class="st02" id="a_3"><a href="http://www.zhnao.com">娱乐</a></li>
   </ul>
   <div class="bor03 cont">
    <div id="c1_1">
     新闻
    </div>
    <div id="c1_2" class="hidden">
     财经
    </div>
    <div id="c1_3" class="hidden">
     娱乐
    </div>
   </div>
  </div>
</div>

<div class="preview">
  <div class="scrolldoorFrame">
   <ul class="scrollUl">
    <li class="st01" id="b_1"><a href="http://www.zhnao.com">新闻</a></li>
    <li class="st02" id="b_2"><a href="http://www.zhnao.com">财经</a></li>
    <li class="st02" id="b_3"><a href="http://www.zhnao.com">娱乐</a></li>
    <li class="st02" id="b_4"><a href="http://www.zhnao.com">军事</a></li>
    <li class="st02" id="b_5"><a href="http://www.zhnao.com">生活</a></li>
   </ul>
   <div class="bor03 cont">
    <div id="c2_1">
     新闻
    </div>
    <div id="c2_2" class="hidden">
     财经
    </div>
    <div id="c2_3" class="hidden">
     娱乐
    </div>
    <div id="c2_4" class="hidden">
     军事
    </div>
    <div id="c2_5" class="hidden">
     生活
    </div>
   </div>
  </div>
</div>

<div class="preview">
  <div class="scrolldoorFrame">
   <ul class="scrollUl">
    <li class="st01" id="c_1"><a href="http://www.zhnao.com">新闻</a></li>
    <li class="st02" id="c_2"><a href="http://www.zhnao.com">财经</a></li>
    <li class="st02" id="c_3"><a href="http://www.zhnao.com">娱乐</a></li>
    <li class="st02" id="c_4"><a href="http://www.zhnao.com">军事</a></li>
    <li class="st02" id="c_5"><a href="http://www.zhnao.com">生活</a></li>
   </ul>
   <div class="bor03 cont">
    <div id="c3_1">
     新闻
    </div>
    <div id="c3_2" class="hidden">
     财经
    </div>
    <div id="c3_3" class="hidden">
     娱乐
    </div>
    <div id="c3_4" class="hidden">
     军事
    </div>
    <div id="c3_5" class="hidden">
     生活
    </div>
   </div>
  </div>
</div>
<div class="preview">
  <div class="scrolldoorFrame">
   <ul class="scrollUl">
    <li class="st01" id="d_1"><a href="http://www.zhnao.com">新闻</a></li>
    <li class="st02" id="d_2"><a href="http://www.zhnao.com">财经</a></li>
    <li class="st02" id="d_3"><a href="http://www.zhnao.com">娱乐</a></li>
    <li class="st02" id="d_4"><a href="http://www.zhnao.com">军事</a></li>
    <li class="st02" id="d_5"><a href="http://www.zhnao.com">生活</a></li>
   </ul>
   <div class="bor03 cont">
    <div id="c4_1">
     新闻
    </div>
    <div id="c4_2" class="hidden">
     财经
    </div>
    <div id="c4_3" class="hidden">
     娱乐
    </div>
    <div id="c4_4" class="hidden">
     军事
    </div>
    <div id="c4_5" class="hidden">
     生活
    </div>
   </div>
  </div>
</div><h5>www.zhnao.com</h5>

如果感觉这样看着不方便，可以直接点击演示地址，把那个html文件下载下来分析即可。再发一次地址吧：

http://www.zhnao.com/download/huadongmen.html
]]> http://www.windsfly.cn/blog/default.asp?id=1915 <![CDATA[在页面上控制图片的大小防止页面会被撑开]]> sf223cn@yahoo.com.cn(admin) Thu,22 Jul 2010 13:50:50 +0800 http://www.windsfly.cn/blog/default.asp?id=1915
程序代码 程序代码
function ReImgSize()
{
for (i=0;i<document.images.length;i++)
{
if (document.all)
{
  if (document.images[i].width>350 && document.images[i].width <720)
  {
   document.images[i].width="350";
   document.images[i].border = "0";
   document.images[i].outerHTML='<a href="'+document.images[i].src+'" target="_blank" title="在新窗口打开图片">'+document.images[i].outerHTML+'</a>'
    }
}
}
  
  
}
]]> http://www.windsfly.cn/blog/default.asp?id=1907 <![CDATA[js时间]]> sf223cn@yahoo.com.cn(admin) Fri,16 Jul 2010 21:54:55 +0800 http://www.windsfly.cn/blog/default.asp?id=1907
程序代码 程序代码
今天是：<SCRIPT language=javascript>
   function isnArray()
   {
   argnr=isnArray.arguments.length
   for(var i=0;i<argnr;i++)
   {
   this[i+1]=isnArray.arguments[i];
   }
   }
   var isnDays=new isnArray("星期一","星期二","星期三","星期四","星期五","星期六","星期日");isnDays[0]="星期日";
   mydate = new Date();
   myyear = mydate.getFullYear();
   mymonth = mydate.getMonth()+1;
   today = mydate.getDate();
   document.write(myyear+"年"+mymonth+"月"+today+"日");
   document.write(" ")
   document.write(isnDays[mydate.getDay()]);
</script>



写法二：
程序代码 程序代码
<script language="javascript">
<!--
var enabled = 0; today = new Date();
var day; var date;
if(today.getDay()==0) day = "星期日"
if(today.getDay()==1) day = "星期一"
if(today.getDay()==2) day = "星期二"
if(today.getDay()==3) day = "星期三"
if(today.getDay()==4) day = "星期四"
if(today.getDay()==5) day = "星期五"
if(today.getDay()==6) day = "星期六"
date = (today.getYear()) + "年" + (today.getMonth() + 1 ) + "月" + today.getDate() + "日  " + day +"";
document.write(date);
// -->
</script>
]]> http://www.windsfly.cn/blog/default.asp?id=1905 <![CDATA[强烈推荐：240多个jQuery插件]]> sf223cn@yahoo.com.cn(admin) Wed,14 Jul 2010 15:29:03 +0800 http://www.windsfly.cn/blog/default.asp?id=1905 概述

jQuery 是继 prototype 之后又一个优秀的 Javascript 框架。其宗旨是—写更少的代码,做更多的事情。它是轻量级的 js 库(压缩后只有21k) ，这是其它的 js 库所不jquery及的，它兼容 CSS3，还兼容各种浏览器（IE 6.0+, FF 1.5+, Safari 2.0+, Opera 9.0+）。 jQuery 是一个快速的，简洁的 javaScript 库，使用户能更方便地处理 HTML documents、events、实现动画效果，并且方便地为网站提供 AJAX 交互。 jQuery 还有一个比较大的优势是，它的文档说明很全，而且各种应用也说得很详细，同时还有许多成熟的插件可供选择。 jQuery 能够使用户的 html 页保持代码和 html 内容分离，也就是说，不用再在 html 里面插入一堆js来调用命令了，只需定义 id 即可。今天在Kollermedia.at上发现了一篇JQuery插件列表的文章，特推荐如下。

文件上传(File upload)JQuery_001

Ajax File Upload.
jQUploader.
Multiple File Upload plugin. 
jQuery File Style.
Styling an input type file.
Progress Bar Plugin.

表单验证(Form Validation)

jQuery Validation.
Auto Help.
Simple jQuery form validation.
jQuery XAV - form validations.
jQuery AlphaNumeric.
Masked Input.
TypeWatch Plugin.
Text limiter for form fields.
Ajax Username Check with jQuery.

表单－选取框(Form - Select Box stuff)

jQuery Combobox.
jQuery controlled dependent (or Cascadign) Select List.
Multiple Selects.
Select box manipulation.
Select Combo Plugin.
jQuery - LinkedSelect
Auto-populate multiple select boxes.
Choose Plugin (Select Replacement).

表单基本、输入框、选择框等(Form Basics, Input Fields, Checkboxes etc.)

jQuery Form Plugin.
jQuery-Form.
jLook Nice Forms.
jNice.
Ping Plugin.
Toggle Form Text.
ToggleVal.
jQuery Field Plugin.
jQuery Form’n Field plugin.
jQuery Checkbox manipulation.
jTagging.
jQuery labelcheck.
Overlabel.
3 state radio buttons.
ShiftCheckbox jQuery Plugin.
Watermark Input.
jQuery Checkbox (checkboxes with imags).
jQuery SpinButton Control.
jQuery Ajax Form Builder.
jQuery Focus Fields.
jQuery Time Entry.

时间、日期和颜色选取(Time, Date and Color Picker)

jQuery UI Datepicker.
jQuery date picker plugin.
jQuery Time Picker.
Time Picker.
ClickPick.
TimePicker.
Farbtastic jQuery Color Picker Plugin.
Color Picker by intelliance.fr.

投票插件(Rating Plugins)

jQuery Star Rating Plugin.
jQuery Star Rater.
Content rater with asp.net, ajax and jQuery.
Half-Star Rating Plugin.

搜索插件(Search Plugins)

jQuery Suggest.
jQuery Autocomplete.
jQuery Autocomplete Mod.
jQuery Autocomplete by AjaxDaddy.
jQuery Autocomplete Plugin with HTML formatting.
jQuery Autocompleter.
AutoCompleter (Tutorial with PHP&MySQL).
quick Search jQuery Plugin.

编辑器(Inline Edit & Editors)JQuery_002

jTagEditor.
WYMeditor.
jQuery jFrame.
Jeditable - edit in place plugin for jQuery.
jQuery editable.
jQuery Disable Text Select Plugin.
Edit in Place with Ajax using jQuery.
jQuery Plugin - Another In-Place Editor.
TableEditor.
tEditable - in place table editing for jQuery.

多媒体、视频、Flash等(Audio, Video, Flash, SVG, etc)

jMedia - accessible multi-media embedding.
JBEdit - Ajax online Video Editor.
jQuery MP3 Plugin.
jQuery Media Plugin.
jQuery Flash Plugin.
Embed QuickTime.
SVG Integration.

图片(Photos/Images/Galleries)

ThickBox.
jQuery lightBox plugin.
jQuery Image Strip.
jQuery slideViewer.
jQuery jqGalScroll 2.0.
jQuery - jqGalViewII.
jQuery - jqGalViewIII.
jQuery Photo Slider.
jQuery Thumbs - easily create thumbnails.
jQuery jQIR Image Replacement.
jCarousel Lite.
jQPanView.
jCarousel.
Interface Imagebox.
Image Gallery using jQuery, Interface & Reflactions.
simple jQuery Gallery.
jQuery Gallery Module.
EO Gallery.
jQuery ScrollShow.
jQuery Cycle Plugin.
jQuery Flickr.
jQuery Lazy Load Images Plugin.
Zoomi - Zoomable Thumbnails.
jQuery Crop - crop any image on the fly.
Image Reflection.

Google地图（Google Map）

jQuery Plugin googlemaps.
jMaps jQuery Maps Framework.
jQmaps.
jQuery & Google Maps.
jQuery Maps Interface forr Google and Yahoo maps.
jQuery J Maps - by Tane Piper.

游戏(Games)

Tetris with jQuery.
jQuery Chess.
Mad Libs Word Game.
jQuery Puzzle.
jQuery Solar System (not a game but awesome jQuery Stuff).

表格等(Tables, Grids etc.)

UI/Tablesorter.JQuery_003
jQuery ingrid.
jQuery Grid Plugin.
Table Filter - awesome!.
TableEditor.
jQuery Tree Tables.
Expandable “Detail” Table Rows.
Sortable Table ColdFusion Costum Tag with jQuery UI.
jQuery Bubble.
TableSorter.
Scrollable HTML Table.
jQuery column Manager Plugin.
jQuery tableHover Plugin.
jQuery columnHover Plugin.
jQuery Grid.
TableSorter plugin for jQuery.
tEditable - in place table editing for jQuery.
jQuery charToTable Plugin.
jQuery Grid Column Sizing.
jQuery Grid Row Sizing.

统计图(Charts, Presentation etc.)

jQuery Wizard Plugin .
jQuery Chart Plugin.
Bar Chart.

边框、圆角、背景(Border, Corners, Background)

jQuery Corner.
jQuery Curvy Corner.
Nifty jQuery Corner.
Transparent Corners.
jQuery Corner Gallery.
Gradient Plugin.

文字和超链接(Text and Links)

jQuery Spoiler plugin.
Text Highlighting.
Disable Text Select Plugin.
jQuery Newsticker.
Auto line-height Plugin.
Textgrad - a text gradient plugin.
LinkLook - a link thumbnail preview.
pager jQuery Plugin.
shortKeys jQuery Plugin.
jQuery Biggerlink.
jQuery Ajax Link Checker.

鼠标提示（Tooltips）

jQuery Plugin - Tooltip.
jTip - The jQuery Tool Tip.
clueTip.
BetterTip.
Flash Tooltips using jQuery.
ToolTip.

菜单和导航(Menus, Navigations)

jQuery Tabs Plugin - awesome! . [demo nested tabs.]
another jQuery nested Tab Set example (based on jQuery Tabs Plugin).
jQuery idTabs.
jdMenu - Hierarchical Menu Plugin for jQuery.
jQuery SuckerFish Style.
jQuery Plugin Treeview.
treeView Basic.
FastFind Menu.
Sliding Menu.
Lava Lamp jQuery Menu.
jQuery iconDock.
jVariations Control Panel.
ContextMenu plugin.
clickMenu.
CSS Dock Menu.
jQuery Pop-up Menu Tutorial.
Sliding Menu.

http://stilbuero.de/jquery/tabs_3/

幻灯、翻转等(Accordions, Slide and Toggle stuff)

jQuery Plugin Accordion.
jQuery Accordion Plugin Horizontal Way.
haccordion - a simple horizontal accordion plugin for jQuery.
Horizontal Accordion by portalzine.de.
HoverAccordion.
Accordion Example from fmarcia.info.
jQuery Accordion Example.
jQuery Demo - Expandable Sidebar Menu.
Sliding Panels for jQuery.
jQuery ToggleElements.
Coda Slider.
jCarousel.
Accesible News Slider Plugin.
Showing and Hiding code Examples.
jQuery Easing Plugin.
jQuery Portlets.
AutoScroll.
Innerfade.

拖放插件(Drag and Drop)

UI/Draggables.
EasyDrag jQuery Plugin.
jQuery Portlets.
jqDnR - drag, drop resize.
Drag Demos.

XML XSL JSON Feeds

XSLT Plugin.
jQuery Ajax call and result XML parsing.
xmlObjectifier - Converts XML DOM to JSON.
jQuery XSL Transform.
jQuery Taconite - multiple Dom updates.
RSS/ATOM Feed Parser Plugin.
jQuery Google Feed Plugin.

浏览器(Browserstuff)

Wresize - IE Resize event Fix Plugin.
jQuery ifixpng.
jQuery pngFix.
Link Scrubber - removes the dotted line onfocus from links.
jQuery Perciformes - the entire suckerfish familly under one roof.
Background Iframe.
QinIE - for proper display of Q tags in IE.
jQuery Accessibility Plugin.
jQuery MouseWheel Plugin.

对话框、确认窗口(Alert, Prompt, Confirm Windows)

jQuery Impromptu.
jQuery Confirm Plugin.
jqModal.
SimpleModal.

CSS

jQuery Style Switcher.
JSS - Javascript StyleSheets.
jQuery Rule - creation/manipulation of CSS Rules.
jPrintArea.

DOM、AJAX和其它JQuery插件（DOM, Ajax and other jQuery plugins）

FlyDOM.
jQuery Dimenion Plugin.
jQuery Loggin.
Metadata - extract metadata from classes, attributes, elements.
Super-tiny Client-Side Include Javascript jQuery Plugin.
Undo Made Easy with Ajax.
JHeartbeat - periodically poll the server.
Lazy Load Plugin.
Live Query.
jQuery Timers.
jQuery Share it - display social bookmarking icons.
jQuery serverCookieJar.
jQuery autoSave.
jQuery Puffer.
jQuery iFrame Plugin.
Cookie Plugin for jQuery.
jQuery Spy - awesome plugin.
Effect Delay Trick.
jQuick - a quick tag creator for jQuery.
Metaobjects.
elementReady.

英文：http://www.kollermedia.at/archive/2007/11/21/the-ultimate-jquery-plugin-list/

]]> http://www.windsfly.cn/blog/default.asp?id=1904 <![CDATA[AJAX弹出提示信息效果]]> sf223cn@yahoo.com.cn(admin) Wed,14 Jul 2010 11:27:58 +0800 http://www.windsfly.cn/blog/default.asp?id=1904
程序代码 程序代码
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>提示信息框</title>
<style type="text/css">
a{ color:#000; font-size:12px;text-decoration:none}
a:hover{ color:#900; text-decoration:underline}
body{background:;filter:progid:DXImageTransform.Microsoft.Gradient(gradientType=0,startColorStr=#ffffff,endColorStr=#003366); overflow:hidden}
#massage_box{ position:absolute; left:e­xpression((body.clientWidth-350)/2); top:e­xpression((body.clientHeight-200)/2); width:350px; height:200px;filter:dropshadow(color=#666666,offx=3,offy=3,positive=2); z-index:2; visibility:hidden}
#mask{ position:absolute; top:0; left:0; width:e­xpression(body.scrollWidth); height:e­xpression(body.scrollHeight); background:#666; filter:ALPHA(opacity=60); z-index:1; visibility:hidden}
.massage{border:#036 solid; border-width:1 1 3 1; width:95%; height:95%; background:#fff; color:#036; font-size:12px; line-height:150%}
.header{background:#036; height:10%; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:12px; padding:3 5 0 5; color:#fff}
</style>
<!--实现层移动-->
<script language="javascript">
var Obj=''
document.onmouseup=MUp
document.onmousemove=MMove

function MDown(Object){
Obj=Object.id
document.all(Obj).setCapture()
pX=event.x-document.all(Obj).style.pixelLeft;
pY=event.y-document.all(Obj).style.pixelTop;
}

function MMove(){
if(Obj!=''){
document.all(Obj).style.left=event.x-pX;
document.all(Obj).style.top=event.y-pY;
}
}

function MUp(){
if(Obj!=''){
document.all(Obj).releaseCapture();
Obj='';
}
}
</script>
</head><body>
<div id="massage_box"><div onmousedown=MDown(massage_box)><div style="display:inline; width:150px; position:absolute">本站提示信息</div>
<span onClick="massage_box.style.visibility='hidden'; mask.style.visibility='hidden'" style="float:right; display:inline; cursor:hand">×</span></div>
<ul style="margin-right:25"><li>
本人申明此博客所有文章（包括文章插图）均为原创，如需引用或转载请注明出处。
</li><li>欢迎大家对博文中观点留言评述，谢绝无聊人士无素质无观点的灌水漫骂。</li><li>本站已设背景音乐，听音乐盒中收集的音乐时请先到页面底部关闭背景音乐。</li></ul></div></div>
<div id="mask"></div>
<span onClick="mask.style.visibility='visible';massage_box.style.visibility='visible'" style="cursor:hand"><a href="#">显示提示信息</a></span>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>bottom here
</body>
</html>
]]> http://www.windsfly.cn/blog/default.asp?id=1903 <![CDATA[网易邮箱的弹出层遮罩效果简单事例AJAX]]> sf223cn@yahoo.com.cn(admin) Wed,14 Jul 2010 11:26:43 +0800 http://www.windsfly.cn/blog/default.asp?id=1903 var alternateFrame=null;//生成的iframe
var alternateWin=null;

window.alert=showAlert;
window.confirm=showConfirm;

/**
* 人机交互窗口，覆盖自带的
*/
function alternateWindow(){
this.win=null;//生成对话框的窗口对象
this.pBody=null;//生成的body容器对象
this.pBg=null;
this.type="alert";//默认的种类是alert
this.FocusWhere="OK";//焦点在哪个按钮上
}
/**
* 模仿的alert窗口
*/
function showAlert(info){
alternateWin=new alternateWindow();
var pBody = alternateWin.init();
alternateWin.initAlertBody(pBody,info);
alternateWin.type="alert";
}
     /**
* 模仿的alert窗口
*/
function showConfirm(info,ok_func,notok_func,ok_str,not_okstr){
alternateWin=new alternateWindow();
var pBody = alternateWin.init();
alternateWin.initConfirmBody(pBody,info,ok_func,notok_func,ok_str,not_okstr);
alternateWin.type="confirm";
}
/**
* 作用：初始基本信息
*/
alternateWindow.prototype.init=function() {
if(alternateFrame==null){
alternateFrame=document.createElement("<iframe allowTransparency='true' id='popframe' frameborder=0 marginheight=0 src='about:blank' marginwidth=0 hspace=0 vspace=0 scrolling=no></iframe>")
alternateFrame.style.position="absolute";
document.body.appendChild(alternateFrame);
}else{
alternateFrame.style.visibility="visible";
}
alternateFrame.style.width=screen.availWidth;
alternateFrame.style.height=screen.availHeight;
alternateFrame.style.left=document.body.scrollLeft;
alternateFrame.style.top=document.body.scrollTop;
alternateFrame.name=alternateFrame.uniqueID;

this.win=window.frames[alternateFrame.name];
this.win.document.write("<body leftmargin=0 topmargin=0 oncontextmenu='self.event.returnValue=false'><div id=popbg></div><div id=popbody></div><div></div></body>");
this.win.document.body.style.backgroundColor="transparent";
document.body.style.overflow="hidden";
this.pBody=this.win.document.body.children[1];
this.pBg=this.win.document.body.children[0];
this.hideAllSelect();
this.initBg();

return this.pBody;
}

/**
* 作用：初始化背景层
     */
alternateWindow.prototype.initBg=function(){
with(this.pBg.style){
position="absolute";
left="0";
top="0";
width="100%";
height="100%";
visibility="hidden";
backgroundColor="#333333";
filter="blendTrans(duration=1) alpha(opacity=30)";
}
this.pBg.filters.blendTrans.apply();
this.pBg.style.visibility="visible";
this.pBg.filters.blendTrans.play();
}
/**
* 作用：初始化显示层
*/
alternateWindow.prototype.initAlertBody=function(obj,info){
with(obj.style){
position="absolute";
width="400";
height="150";
backgroundColor="#ffffff";
}
obj.style.left=window.document.body.clientWidth/2-200;
obj.style.top=window.document.body.clientHeight/3;
var str;
str ="<table border=0 cellpadding=0 cellspacing=1 bgcolor=#000000 width=100% height=100%><tr height=30>";
str+="<td align=left style='color:#000000;font-size:14px;font-weight:bold' bgcolor=#9999ff>[提示]</td></tr>";
str+="<tr><td align=center bgcolor=#efefff style='font-size:12px;color:#000000;vertical-align: middle;'>";
str+=info+"</td></tr><tr height=30 bgcolor=#efefef><td align=center>" +
        "<input type='button' value='确定' id='OK'" +
        " onkeydown='parent.alternateWin.onKeyDown(event,this)'"+
        " onclick='parent.alternateWin.closeWin()' style='border:solid 1px #666666;background:#cccccc'>" +
        "</td></tr></table>";
obj.innerHTML=str;
this.win.document.body.all.OK.focus();
this.FocusWhere="OK";
}

alternateWindow.prototype.onKeyDown=function(event,obj){
     switch(event.keyCode){
     case 9:
      event.keyCode=-1;
     if(this.type=="confirm"){
     if(this.FocusWhere=="OK"){
     this.win.document.body.all.NO.focus();
     this.FocusWhere="NO";
     }else{
     this.win.document.body.all.OK.focus();
     this.FocusWhere="OK";
     }
     }
     break;
     case 13:obj.click();;break;
     case 27:this.closeWin();break;
     }

     }
/**
* 作用：初始化显示层 conFirm提示层
*/
alternateWindow.prototype.initConfirmBody=function(obj,info,ok_func,notok_func,ok_str,notok_str){
with(obj.style){
position="absolute";
width="400";
height="150";
backgroundColor="#ffffff";
}
if(ok_str==null){
ok_str="确定";
}
if(notok_str==null){
notok_str="取消"
}
obj.style.left=window.document.body.clientWidth/2-200;
obj.style.top=window.document.body.clientHeight/3;
var str;
str="<table border=0 cellpadding=0 cellspacing=1 bgcolor=#000000 width=100% height=100%><tr height=30>";
str+="<td align=left style='color:#000000;font-size:14px;font-weight:bold' bgcolor=#9999ff>[询问]</td></tr>";
str+="<tr><td align=center bgcolor=#efefff style='font-size:12px;color:#000000;vertical-align: middle;'>";
str+=info+"</td></tr><tr height=30 bgcolor=#efefef><td align=center>" +
"<input type='button' id='OK'" +
" onkeydown='parent.alternateWin.onKeyDown(event,this)'"+
" onclick='parent.alternateWin.closeWin();parent."+ok_func+"();' " +
" value='"+ok_str+"' style='border:solid 1px #666666;background:#cccccc'>"+
"&nbsp;&nbsp;&nbsp;<input type='button' value='"+notok_str+"' id='NO'"+
" onkeydown='parent.alternateWin.onKeyDown(event,this)'"+
" onclick='parent.alternateWin.closeWin();" +
" parent."+notok_func+"();' style='border:solid 1px #666666;background:#cccccc'></td></tr></table>";
obj.innerHTML=str;
this.win.document.body.all.OK.focus();
}

/**
* 作用：关闭一切
*/
alternateWindow.prototype.closeWin=function(){
alternateFrame.style.visibility="hidden";
this.showAllSelect();
document.body.style.overflow="auto";
}
/**
     * 作用:隐藏所有的select
     */
alternateWindow.prototype.hideAllSelect=function(){
     var obj;
     obj=document.getElementsByTagName("Select");
     var i;
     for(i=0;i<obj.length;i++)
obj[i].style.visibility="hidden";
     }
/**
* 显示所有的select
*/
     alternateWindow.prototype.showAllSelect=function(){
     var obj;
     obj=document.getElementsByTagName("Select");
     var i;
     for(i=0;i<obj.length;i++)
obj[i].style.visibility="visible";
}
</script>

<!---------------------------------------------------------------->
<script>
function clk_yes(){
alert("你也同意了我的观点");
}
function clk_no(){
alert("不是你眼花了就是我眼花了！");
}

</script>


<body>
<button onClick="alert('我觉得今天天气真的很不错！')">test</button>
<button onClick="confirm('今天天气真的很好啊，难道不是么？','clk_yes','clk_no','就算是吧','乱讲')">询问框测试</button>
</body>

]]> http://www.windsfly.cn/blog/default.asp?id=1902 <![CDATA[jQuery技巧大放送]]> sf223cn@yahoo.com.cn(admin) Wed,14 Jul 2010 11:23:33 +0800 http://www.windsfly.cn/blog/default.asp?id=1902 通过jquery的$()引用元素包括通过id、class、元素名以及元素的层级关系及dom或者xpath条件等方法，且返回的对象为jquery对象（集合对象），不能直接调用dom定义的方法。

2、jQuery对象与dom对象的转换
只有jquery对象才能使用jquery定义的方法。注意dom对象和jquery对象是有区别的，调用方法时要注意操作的是dom对象还是jquery对象。
普通的dom对象一般可以通过$()转换成jquery对象。
如：$(document.getElementById("msg"))则为jquery对象，可以使用jquery的方法。
由于jquery对象本身是一个集合。所以如果jquery对象要转换为dom对象则必须取出其中的某一项，一般可通过索引取出。
如：$("#msg")[0]，$("div").eq(1)[0]，$("div").get()[1]，$("td")[5]这些都是dom对象，可以使用dom中的方法，但不能再使用Jquery的方法。
以下几种写法都是正确的：
$("#msg").html();
$("#msg")[0].innerHTML;
$("#msg").eq(0)[0].innerHTML;
$("#msg").get(0).innerHTML;

3、如何获取jQuery集合的某一项
对于获取的元素集合，获取其中的某一项（通过索引指定）可以使用eq或get(n)方法或者索引号获取，要注意，eq返回的是jquery对象，而get(n)和索引返回的是dom元素对象。对于jquery对象只能使用jquery的方法，而dom对象只能使用dom的方法，如要获取第三个<div>元素的内容。有如下两种方法：
$("div").eq(2).html();    //调用jquery对象的方法
$("div").get(2).innerHTML; //调用dom的方法属性

4、同一函数实现set和get
Jquery中的很多方法都是如此，主要包括如下几个：
$("#msg").html();    //返回id为msg的元素节点的html内容。
$("#msg").html("<b>new content</b>");
//将“<b>new content</b>” 作为html串写入id为msg的元素节点内容中,页面显示粗体的new content

$("#msg").text();    //返回id为msg的元素节点的文本内容。
$("#msg").text("<b>new content</b>");
//将“<b>new content</b>” 作为普通文本串写入id为msg的元素节点内容中,页面显示<b>new content</b>

$("#msg").height();    //返回id为msg的元素的高度
$("#msg").height("300"); //将id为msg的元素的高度设为300
$("#msg").width();    //返回id为msg的元素的宽度
$("#msg").width("300"); //将id为msg的元素的宽度设为300

$("input").val("); //返回表单输入框的value值
$("input").val("test"); //将表单输入框的value值设为test

$("#msg").click(); //触发id为msg的元素的单击事件
$("#msg").click(fn); //为id为msg的元素单击事件添加函数
同样blur,focus,select,submit事件都可以有着两种调用方法

5、集合处理功能
对于jquery返回的集合内容无需我们自己循环遍历并对每个对象分别做处理，jquery已经为我们提供的很方便的方法进行集合的处理。
包括两种形式：
$("p").each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]})
//为索引分别为0，1，2的p元素分别设定不同的字体颜色。

$("tr").each(function(i){this.style.backgroundColor=['#ccc','#fff'][i%2]})
//实现表格的隔行换色效果

$("p").click(function(){alert($(this).html())})    
//为每个p元素增加了click事件，单击某个p元素则弹出其内容

6、扩展我们需要的功能
$.extend({
min: function(a, b){return a < b?a:b; },
max: function(a, b){return a > b?a:b; }
}); //为jquery扩展了min,max两个方法
使用扩展的方法（通过“$.方法名”调用）：
alert("a=10,b=20,max="+$.max(10,20)+",min="+$.min(10,20));

7、支持方法的连写
所谓连写，即可以对一个jquery对象连续调用各种不同的方法。
例如：
$("p").click(function(){alert($(this).html())})
.mouseover(function(){alert('mouse over event')})
.each(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]});

8、操作元素的样式
主要包括以下几种方式：
$("#msg").css("background");    //返回元素的背景颜色
$("#msg").css("background","#ccc") //设定元素背景为灰色
$("#msg").height(300); $("#msg").width("200"); //设定宽高
$("#msg").css({ color: "red", background: "blue" });//以名值对的形式设定样式
$("#msg").addClass("select"); //为元素增加名称为select的class
$("#msg").removeClass("select"); //删除元素名称为select的class
$("#msg").toggleClass("select"); //如果存在（不存在）就删除（添加）名称为select的class



9、完善的事件处理功能

Jquery已经为我们提供了各种事件处理方法，我们无需在html元素上直接写事件，而可以直接为通过jquery获取的对象添加事件。
如：
$("#msg").click(function(){alert("good")}) //为元素添加了单击事件
$("p").click(function(i){this.style.color=['#f00','#0f0','#00f'][ i ]})
//为三个不同的p元素单击事件分别设定不同的处理
jQuery中几个自定义的事件：
（1）hover(fn1,fn2)：一个模仿悬停事件（鼠标移动到一个对象上面及移出这个对象）的方法。当鼠标移动到一个匹配的元素上面时，会触发指定的第一个函数。当鼠标移出这个元素时，会触发指定的第二个函数。
//当鼠标放在表格的某行上时将class置为over，离开时置为out。
$("tr").hover(function(){
$(this).addClass("over");
},
function(){
$(this).addClass("out");
});
（2）ready(fn):当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
$(document).ready(function(){alert("Load Success")})
//页面加载完毕提示“Load Success”,相当于onload事件。与$(fn)等价
（3）toggle(evenFn,oddFn): 每次点击时切换要调用的函数。如果点击了一个匹配的元素，则触发指定的第一个函数，当再次点击同一元素时，则触发指定的第二个函数。随后的每次点击都重复对这两个函数的轮番调用。
//每次点击时轮换添加和删除名为selected的class。
$("p").toggle(function(){
   $(this).addClass("selected");
},function(){
   $(this).removeClass("selected");
});
（4）trigger(eventtype): 在每一个匹配的元素上触发某类事件。
例如：
$("p").trigger("click");    //触发所有p元素的click事件
（5）bind(eventtype,fn)，unbind(eventtype): 事件的绑定与反绑定
从每一个匹配的元素中（添加）删除绑定的事件。
例如：
$("p").bind("click", function(){alert($(this).text());}); //为每个p元素添加单击事件
$("p").unbind(); //删除所有p元素上的所有事件
$("p").unbind("click") //删除所有p元素上的单击事件

10、几个实用特效功能
其中toggle()和slidetoggle()方法提供了状态切换功能。
如toggle()方法包括了hide()和show()方法。
slideToggle()方法包括了slideDown()和slideUp方法。

11、几个有用的jQuery方法
$.browser.浏览器类型：检测浏览器类型。有效参数：safari, opera, msie, mozilla。如检测是否ie：$.browser.isie，是ie浏览器则返回true。
$.each(obj, fn)：通用的迭代函数。可用于近似地迭代对象和数组（代替循环）。
如
$.each( [0,1,2], function(i, n){ alert( "Item #" + i + ": " + n ); });
等价于：
var tempArr=[0,1,2];
for(var i=0;i<tempArr.length;i++){
alert("Item #"+i+": "+tempArr[ i ]);
}
也可以处理json数据，如
$.each( { name: "John", lang: "JS" }, function(i, n){ alert( "Name: " + i + ", Value: " + n ); });
结果为：
Name:name, Value:John
Name:lang, Value:JS
$.extend(target,prop1,propN)：用一个或多个其他对象来扩展一个对象，返回这个被扩展的对象。这是jquery实现的继承方式。
如：
$.extend(settings, options);
//合并settings和options，并将合并结果返回settings中，相当于options继承setting并将继承结果保存在setting中。
var settings = $.extend({}, defaults, options);
//合并defaults和options，并将合并结果返回到setting中而不覆盖default内容。
可以有多个参数（合并多项并返回）
$.map(array, fn)：数组映射。把一个数组中的项目(处理转换后)保存到到另一个新数组中，并返回生成的新数组。
如：
var tempArr=$.map( [0,1,2], function(i){ return i + 4; });
tempArr内容为：[4,5,6]
var tempArr=$.map( [0,1,2], function(i){ return i > 0 ? i + 1 : null; });
tempArr内容为：[2,3]
$.merge(arr1,arr2):合并两个数组并删除其中重复的项目。
如：$.merge( [0,1,2], [2,3,4] ) //返回[0,1,2,3,4]
$.trim(str)：删除字符串两端的空白字符。
如：$.trim("   hello, how are you? "); //返回"hello,how are you? "

12、解决自定义方法或其他类库与jQuery的冲突
很多时候我们自己定义了$(id)方法来获取一个元素，或者其他的一些js类库如prototype也都定义了$方法，如果同时把这些内容放在一起就会引起变量方法定义冲突，Jquery对此专门提供了方法用于解决此问题。
使用jquery中的jQuery.noConflict();方法即可把变量$的控制权让渡给第一个实现它的那个库或之前自定义的$方法。之后应用Jquery的时候只要将所有的$换成jQuery即可，如原来引用对象方法$("#msg")改为jQuery("#msg")。
如：
jQuery.noConflict();
// 开始使用jQuery
jQuery("div p").hide();
// 使用其他库的 $()
$("content").style.display = 'none'; ]]>