tab-view.js 的简单例子
http://www.dhtmlgoodies.com/scripts/tab-view/tab-view.html#
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>DHTML Tab script</title>
<meta name="Author" content="Alf Magne Kalleland (post@dhtmlgoodies.com)">
<META NAME="Generator" CONTENT="Alf Magne Kalleland (www.dhtmlgoodies.com)">
<meta name="KeyWords" content="Tab view,XP tab view,DHTML tabs,tabs,tab pane,tab navigation">
<meta name="Description" content="A library of DHTML and Ajax scripts">
<meta name="country" content="Norway">
<meta name="organization-Email" content="post@dhtmlgoodies.com">
<meta name="copyright" content="copyright 2005 - Alf Magne Kalleland">
<meta name="coverage" content="Worldwide">
<meta name="revisit_after" content="30days">
<meta name="title" content="A library DHTML and Ajax scripts - DHTMLgoodies.com">
<meta name="identifier" content="http://www.dhtmlgoodies.com/">
<meta name="language" content="English">
<meta name="robots" content="follow">
<meta name="googlebot" content="index, follow">
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-2042963-1");
pageTracker._trackPageview();
</script>
<style type="text/css">
body{
margin:10px;
font-size:0.9em;
}
a{
color:#F00;
}
</style>
<link rel="stylesheet" href="css/tab-view.css" type="text/css" media="screen">
<script type="text/javascript" src="js/ajax.js"></script>
<script type="text/javascript" src="js/tab-view.js">
/************************************************************************************************************
(C) www.dhtmlgoodies.com, October 2005
This is a script from www.dhtmlgoodies.com. You will find this and a lot of other scripts at our website.
Terms of use:
You are free to use this script as long as the copyright message is kept intact. However, you may not
redistribute, sell or repost it without our permission.
Updated:
March, 14th, 2006 - Create new tabs dynamically
Thank you!
www.dhtmlgoodies.com
Alf Magne Kalleland
************************************************************************************************************/
</script>
</head>
<body>
<script type="text/javascript"><!--
google_ad_client = "pub-0714236485040063";
/* 468x60, opprettet 14.08.08 */
google_ad_slot = "7945138075";
google_ad_width = 468;
google_ad_height = 60;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
<img src="/images/heading3.gif">
<div id="dhtmlgoodies_tabView1">
<div class="dhtmlgoodies_aTab">
<img src="/images/dhtmlgoodies_logo1.gif" style="float:left;margin-right:5px;margin-bottom:5px"> This is the content of the first tab. This is just a plain <DIV>. The tabs
are created by a javascript function. This is the content of the first tab. This is just a plain <DIV>. The tabs
are created by a javascript function. This is the content of the first tab. This is just a plain <DIV>. The tabs
are created by a javascript function. <br><br>
<a href="#" onclick="createNewTab('dhtmlgoodies_tabView1','A dynamic tab','','externalfile.html',true);return false">Create new tab dynamically</a><br>
<a href="#" onclick="deleteTab('Menu scripts')">Remove this tab</a><br>
</div>
<div class="dhtmlgoodies_aTab">
This is the content of the second tab. <br>
<a href="#" onclick="deleteTab('Calendar')">Remove this tab</a><br>
</div>
<div class="dhtmlgoodies_aTab">
This script is tested in
<a href="#" onclick="deleteTab('Menus')">Remove this tab</a><br>
<ul>
<li>IE 5.5</li>
<li>IE 6</li>
<li>Opera 8.5</li>
<li>Firefox</li>
</ul>
</div>
<div class="dhtmlgoodies_aTab">
Content of tab 4<br>
</div>
</div>
<script type="text/javascript">
initTabs('dhtmlgoodies_tabView1',Array('Menu scripts','Calendar','Menus','About us'),0,500,400,Array(false,true,true,true));
</script>
<!-- Kontera ContentLink(TM);-->
<script type='text/javascript'>
var dc_AdLinkColor = 'blue' ;
var dc_PublisherID = 3695 ;
</script>
<script type='text/javascript' src='http://kona.kontera.com/javascript/lib/KonaLibInline.js'>
</script>
<!-- Kontera ContentLink(TM) -->
</body>
</html>
