[ Mini Kiebo ]
Server: Windows NT DESKTOP-5B8S0D4 6.2 build 9200 (Windows 8 Professional Edition) i586
Path:
D:
/
xampp182
/
htdocs
/
simpeg
/
zapatec
/
zptabs
/
zptabs
/
demo
/
[
Home
]
File: close.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd"> <html> <head> <meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=utf-8"> <meta name="description" content=" Closable Tabs demo with three Tabs: Home, Inbox, and Spam Home tab is visible by default. It contains two links that open 2 other tabs: Inbox and Spam. Inbox and Spam tabs can be closed by pressing the x button. "> <meta name="keywords" content="dhtml tools,javascript,DHTML Tools,Javascript,ajax,AJAX,Ajax,ajax tools,AJAX Tools,tools controls,simple javascript tools"> <title>Zapatec DHTML Tabs Widget - Closable Demo</title> <!-- Common JS files --> <script type='text/javascript' src='../../utils/zapatec.js'></script> <!-- Custom includes --> <script type="text/javascript" src="../src/zptabs.js"></script> <!-- ALL demos need these css --> <link href="../../website/css/zpcal.css" rel="stylesheet" type="text/css"> <link href="../../website/css/template.css" rel="stylesheet" type="text/css"> <style type="text/css"> body { width: 778px; } </style> <link rel="SHORTCUT ICON" href="http://www.zapatec.com/website/main/favicon.ico"> </head> <body> <div class='zpCalSubHeader' style='text-align:center;'>Closable Demo</div> <div class='zpCalDemoText'> <ul> <li>Closable Tabs demo with three Tabs: Home, Inbox, and Spam</li> <li>Home tab is visible by default. It contains two links that open 2 other tabs: Inbox and Spam.</li> <li>Inbox and Spam tabs can be closed by pressing the x button.</li> </ul> </div> <div id="tabBar" style="width: 500px"></div> <div id="tabs" style="height: 200px"> <div id="home"> <label accesskey="h" title="Home"><u>H</u>ome</label> Home Tab<br><br> <a href="#tabs=inbox" onclick="viewInbox()">View Inbox</a><br><br> <a href="#tabs=spam" onclick="viewSpam()">View Spam</a> </div> <div id="inbox"> <label accesskey="i" title="Inbox" closable="true" style="display: none;"><u>I</u>nbox</label> Inbox Tab </div> <div id="spam"> <label accesskey="s" title="Spam" closable="true" style="display: none;"><u>S</u>pam</label> Spam Tab </div> </div> <div style="padding: 10px; text-align: right"> <button onclick="objTabs.prevTab()" accesskey="p">« <u>P</u>rev.</button> <button onclick="objTabs.nextTab()" accesskey="n"><u>N</u>ext »</button> </div> <script type="text/javascript"> var objTabs = new Zapatec.Tabs({ // ID of Top bar to show the Tabs: Game, Photo, Music, Chat tabBar: 'tabBar', /* ID to get the LABEL contents to create the tabBar tabs Also, each DIV in this ID will contain the contents for each tab */ tabs: 'tabs', // Theme to use for the tabs theme: 'default', themePath: '../themes/', closeAction: 'hide' }); function viewSpam() { objTabs.changeTab('spam'); } function viewInbox() { objTabs.changeTab('inbox'); } </script> <noscript> <br/> This page uses an <a href='http://www.zapatec.com/website/main/products/suite/'> AJAX Component</a> - Zapatec DHTML Tabs Widget, but your browser does not support Javascript. <br/> <br/> </noscript> <br/><br/><br/> <div class="footer" style='width: 778px; text-align:center; margin-top:2em'> © 2004-2007 <strong> <a href='http://www.zapatec.com/'>Zapatec, Inc.</a> </strong> </div> </body> </html>