<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML>
<HEAD>
<TITLE>JQuery MagicTabs基本使用</TITLE>
<META content="text/html; charset=GB2312" http-equiv="Content-Type">
<META name="google-site-verification" content="yaeorbXgKPwp5BDegBtAJEHYWFEFE-BViWTj74gJPrw"><!--  -->
<META name="GENERATOR" content="MSHTML 8.00.6001.19328">
<META name="description" content="JQuery MagicTabs 的基本使用">
<META name="keywords" content="JQuery Tabs Plugin">

<LINK rel="stylesheet" type="text/css" href="css/default.css">
<LINK rel="stylesheet" type="text/css" href="css/default(1).css">
<link  href="css/public.css" type="text/css" rel="stylesheet">
<link  href="css/index_user.css" type="text/css" rel="stylesheet">

<SCRIPT type="text/javascript" src="js/jquery-1.8.2.min.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/cn.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/core.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/global.js"></SCRIPT>
<SCRIPT type="text/javascript" src="js/tabs.js"></SCRIPT>
</HEAD><BODY>
<STYLE stype="text/css"></STYLE>
<SCRIPT type="text/javascript" src="js/mousewheel.js"></SCRIPT>
<DIV class=toolbar>
<DIV id=addTabBtn class="item button" style="width:200px;">Add</DIV>
</DIV>
<DIV class=clear></DIV>
<DIV style="MARGIN: 4px; HEIGHT: 600px;" class=tabs></DIV>
<SCRIPT type=text/javascript>
//$(function(){ window.onload = function(){
var dd = [], i=0;
for(i=0; i<1; i++){
var txt = '<div id ="frame-main-nav" class="frame-main-nav">';
txt = txt + '<iframe src="message_left.html" width="173px;" height="100%" frameborder=0  scrolling="no" name="left_ifr"></iframe></div>';
txt = txt + '<div id ="frame-main-cont" class="frame-main-cont">';
txt = txt + '<iframe src="message_right.html" width="100%" height="100%" frameborder=0 scrolling="no" name="right_ifr" ></iframe></div>'; var a = {
code: 'tab' + i,
title: ' 默认标签 ' + i,
closeable: i>1,
el: txt
};
dd.push(a);
}
var tabs = $('.tabs');
tabs.mac('tabs', {
tabWidth: 80, //Use fix width
items: dd,
onCloseTab: function(me, c, a){
tnCbx.find('[value=' + c + ']').remove();
return true;
}
}).selectFirst();
var thd = tabs.children('.head'), thm = thd.children('.main');
thd.mousewheel(function(e, delta, deltaX, deltaY){
thm.scrollLeft(thm.scrollLeft() - deltaY * 40);
return false;
});
//extra control
var tnCbx = $('#tabNoCbx').change(function(){
tabs.select($(this).val());
});
App.options(tnCbx, {
data: dd,
keyField: 'code',
render: function(r){
return 'Select Tab #' + r.code;
}
});
var atBtn = $('#addTabBtn').click(function(){
var a = tabs.addTab({
code: 'tab' + i,
title: '新标签 ' + i,
closeable: i>0,
el: 'Content of Tab' + i // You can put anything here
});
tabs.select('tab' + i);
tnCbx.append('<option value="tab'
+ i + '">Select Tab #tab' + i + '</option>');
i++;
});
//});
};
</SCRIPT>
</BODY></HTML>上面的是我做的一个 类似于163 邮箱的选项卡 功能   涉及到的每个选项卡的DIV里面 嵌套ifream 但是现在的问题是
jquery 加载之后页面的ifream 就是加载不出来     查一些资料说是加载先后的问题  但是即使我用window.onload 方法也不行   懂得指教一下