Jquery の $.cookie()_jquery に基づくクロスページ タブ ナビゲーションの実装コード

--------tabs.js-----------------

复制代幣 代码如下:

$(function(){
//選択されたタブを初期化
var on= $.cookie('current_tab');
if (on!="" && !isNaN(on))
{
$(".nav li").eq(on).addClass("on").siblings().removeClass(); 🎜>}
//デフォルトのタブ
else
{ $.cookie('current_tab', 0) }
// タブを変更
$(".nav li").click (function(){
var current_tab = $(".nav li").index(this);
$.cookie('current_tab', current_tab);
window.location = $(this) .attr("href");
})
})

--------------css.css---- ------------------

复制代码 代码如下:

.nav { オーバーフロー:非表示; height:20px;}
.nav li { float:left;表示:インライン;パディング:3px;}
.nav li a:hover { color: yellow;
.nav li.on {background:#900; color:#FFF;}
.nav li.on a { color:#fff; }
.nav li.on a:hover { color: yellow; }
a { text-decoration:none; }

--------------------- 1.html ---------------- -------------------

复制代码代码如下:

• 第一页


• 第二页


• 第三页

其它两个页面一样，文件改一下可了
Mark Dzone 夜猫人
来自：http://www.cnblogs.com/dzone