使用方法:
引入js：
<script type="text/javascript" src="js/jquery-1.3.2.min.js" ></script>
<script type="text/javascript" src="js/skin.js" ></script>
js代码：
/*
用法：
swichStyle(styleId,swichId,stylePath);
参数说明：
styleId : <link rel="stylesheet" type="text/css" href="css/default.css" id="skin" /> 中的id
swichId ：<ul id="switch-skin"> 切换样式列表的id
stylePath :css存放的路径
*/
$(document).ready(function(){
swichStyle("skin","switch-skin","css/");
});
切换样式代码：
<ul id="switch-skin">
<li id="default">skin1</li>
<li id="green">skin2</li>
<li id="blue">skin3</li>
</ul>
演示地址：http://wlog.com.cn/code/jquery/switch-style/demo.html
下载地址：switch-style下载
直接加class liteBox调用， 有加载进度条，在链接中设置宽度、高度和是否有滚动条！js压缩代码1.4k
演示地址：http://wlog.com.cn/code/jquery/liteBox/demo.html
下载地址：liteBox
演示地址：http://wlog.com.cn/code/jquery/liandong/demo.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>jQuery 二级联动</title>
<script src="http://wlog.com.cn/lib/jquery/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#province").change(function(){
$("#province option").each(function(i,o){
if($(this).attr("selected"))
{
$(".city").hide();
$(".city").eq(i).show();
}
});
});
$("#province").change();
});
</script>
</head>
<body>
<select id="province">
<option>----请选择省份----
<option>北京
<option>上海
<option>江苏
</select>
<select class="city">
<option>----请选择城市----
</select>
<select class="city">
<option>东城</option>
<option>西城</option>
<option>崇文</option>
<option>宣武</option>
<option>朝阳</option>
</select>
<select class="city">
<option>黄浦</option>
<option>卢湾</option>
<option>徐汇</option>
<option>长宁</option>
<option>静安</option>
</select>
<select class="city">
<option>南京</option>
<option>镇江</option>
<option>苏州</option>
<option>南通</option>
<option>扬州</option>
</select>
</body>
</html>
一款不错的密码强度插件！
1 jquery.pstrength插件和jquery文件
2 载入jquery文件和jquery.pstrength文件
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.pstrength-min.1.2.js"></script>
<script type="text/javascript">
$(function() {
$('#user_password').pstrength();
});
</script>
3 HTML加入密码输入框，id=”user_password”:
密码：<input type="password" id="user_password" name="user_password" />
4 css:
.pstrength-minchar {
font-size : 10px;
}
input {
width:180px;
height:12px;
line-height:12px;
padding:4px 0px;
border: #cfcfcf 1px solid;
color: #585858;
}
演示地址
插件官方地址：Ajax Password Strength Meter Script
英文原文：jQuery Performance Rules By–— Ron Burgundy
1. 总是从ID选择器开始继承
2. 在class前使用tag
3. 将jquery对象缓存起来
4. 掌握强大的链式操作
5. 使用子查询
6. 对直接的DOM操作进行限制
7. 冒泡
8. 消除无效查询
9. 推迟到 $(window).load
10. 压缩js
11. 全面掌握jquery库
查看全文
文件里的example.html是调用页面，所有的颜色主题和调用方法都可以通过这个页面呈现出来！
下载：jquery-ui-datepicker
演示图片：
使用方法：
需要使用jQuery库文件(目前版本1.3)和jQuery CalendarWidget库文件(目前版本1.1)
自定义日历显示效果的CSS样式文件，控制jQuery插件CalendarWidget日历工具样式
一，包含文件部分
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.calendar-widget.js"></script>
二，HTML部分
<div id="calendar">
<p>jQuery插件CalendarWidget日历</p>
</div>
三，Javascript部分
<script>
$("#calendar").calendarWidget({
month: 5, year: 2009
});
</script>
实例可知使用jQuery插件CalendarWidget日历工具实现Javascript简单日历功能非常简单，只需要配置两个参数，分别是 month月和year年，如果想显示中文，只需要修改jQuery插件CalendarWidget日历工具的JS库文件，制作一个 Javascript日历，就是这么简单。
演示地址：http://wlog.com.cn/code/jquery/jQuery-Calendar-Widget/demo.html
下载：Calendar.rar
翻译完成，欢迎大家查阅并指正其中的错误。
感谢为之漫笔。他是1.1API的翻译者。1.2的翻译是完全基于1.1的API翻译的，拜一记
感谢Ross Wan写的这个样式。本次翻译是基于他的英文版制作的
感谢Cloudream,他也一起参与翻译了工具和AJAX部分。并且加入了英文说明切换功能。
感谢一秋，制作了CHM版，现在可以直接查询了。
需要的朋友可以再下载一次离线版。
在线查看地址：http://wlog.com.cn/lab/jQueryAPI-1.3/index.html
离线版下载：http://code.google.com/p/jquery-api-zh-cn/downloads/list
用jquery通过简单的几行代码可以实现文章图片数字顺序列表，可以用于一些文章排行等。
演示地址：http://wlog.com.cn/code/jquery/numlist/num-list.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=utf-8" />
<title>jQuery简单实现图数字顺序图片列表</title>
<script src="http://wlog.com.cn/lib/jquery/jquery-1.3.2.js" type="text/javascript"></script>
<script type="text/javascript">
<!--
$(document).ready(function(){
$("#numList").find("li").each(function(i){
$(this).addClass("num"+(i+1));
//css 中样式从.num1 开始，所以用i+1
});
})
-->
</script>
<style type="text/css">
ul,li {margin:0px; padding:0px;}
li {line-height:25px;}
.num1,.num2,.num3,.num4,.num5,.num6,.num7,.num8,.num9 {
text-indent:24px;
background:url(http://wlog.com.cn/code/jquery/numlist/images/num.gif) no-repeat;
border-bottom:1px #C3C3C3 solid;
overflow:hidden;
}
.num1 {background-position:0px -3px; }
.num2 {background-position:-2px -40px;}
.num3 {background-position:-4px -75px;}
.num4 {background-position:-6px -110px;}
.num5 {background-position:-6px -145px;}
.num6 {background-position:-6px -180px;}
.num7 {background-position:-6px -215px;}
.num8 {background-position:-6px -250px;}
.num9 {background-position:-6px -285px;}
</style>
</head>
<body>
<ul id="numList">
<li>韩国新秀金新雅资料</li>
<li>我的11款春夏发型真人秀</li>
<li>祛斑收毛孔 7个经济小偏方</li>
<li>林志玲四款盐美容秘</li>
<li>诀 范冰冰章子怡示范上妆9禁</li>
<li>忌 平民美女 4种超省钱养颜</li>
<li>法 中国式妖娆 吕燕经典照 </li>
</ul>
</body>
</html>
