jQuery弹出层插件与使用方法

<!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>
</head>

<body>
jquery弹出层插件大全：
1.thickbox

目前用的比较多的，最新版本是thickbox3.1
下载地址：http://jquery.com/demo/thickbox/#examples

2.colorbox
官方网站：http://colorpowered.com/colorbox/
下载地址：http://colorpowered.com/colorbox/colorbox.zip
演示实例:http://colorpowered.com/colorbox/core/example1/index.html

3.fancybox
官方网站：http://fancybox.net
下载地址：http://fancybox.googlecode.com/files/jquery.fancybox-1.2.5.zip
演示实例:http://fancybox.net/example

4.jqueryui dialog
官方网站：http://jqueryui.com/demos/dialog/
下载地址：http://jqueryui.com/demos/dialog/
演示实例:http://jqueryui.com/demos/dialog/

5.dom window
官方网站：http://swip.codylindley.com/
下载地址：http://swip.codylindley.com/jquery.domwindow.网页特效
演示实例:http://swip.codylindley.com/domwindowdemo.html

6.shadowbox
官方网站：http://www.shadowbox-js.com/
下载地址：http://www.shadowbox-js.com/download.html
演示实例:http://www.shadowbox-js.com/index.html
</body>
</html>

下面发布一些jquery插件的用法

简单配置一下就可以实现如下效果：

http://flowplayer.org/tools/demos/tabs/index.html

2、扩展css教程样式就可以定做自己的tabs

/* alternate colors: skin2 */
ul .skin2 a {
    background-color: #89a ;
    color: #fff !important;
}

/* mouseo教程ver state */
ul .skin2 a :hover {
    background-color: #678 ;
}

/* active tab */
ul .skin2 a .current {
    background-color: #4f5c6a ;
    border-bottom: 2px solid #4f5c6a ;
}

/* tab pane with background gradient */
div .skin2 div {
    color: #fff ;
    background: #234 url( /img/global/gradient/h300.png) repeat-x scroll 0 -50px ;
    min-height: 200px ;
}

效果如下：

http://flowplayer.org/tools/demos/tabs/skins.html

3、只是浏览器的【前进】和【后退】

code
$( function () { $( " ul.css-tabs " ).tabs( " div.css-panes > div " , {history: true }); });
效果如下：

http://flowplayer.org/tools/demos/tabs/history.html

4.通过ajax调用每个tab的内容，只有第一次点击tab按钮的时候调用tab页内容

使用非常简单，效果如下：

http://flowplayer.org/tools/demos/tabs/ajax.html

5、tab向导，比如形成购物车订单过程

完善个人信息->修改购物车商品->查看订单

效果如下：http://flowplayer.org/tools/demos/tabs/wizard.html

此种功能特别有用。

6、其他的还有手风琴效果，自己发掘吧，显示地址如下：

http://flowplayer.org/tools/demos/tabs/accordion-horizontal.html

此插件的下载地址如下：

http://flowplayer.org/tools/download.html

jquery.tools.min.js是一个ui功能包，还包括其他的一个ui特效

tooltip ：很不错的提示功能插件

scrollable ：滚动效果插件

overlay ：很好用的遮罩层插件

expose ：背景变暗效果

补充：网页制作,jquery