/* set up browser checks and add a simple emulation for IE4 */
// check browsers
var op = /opera 5|opera\/5/i.test(navigator.userAgent);
var ie = !op && /msie/i.test(navigator.userAgent); // preventing opera to be identified as ie
var mz = !op && /mozilla\/5/i.test(navigator.userAgent); // preventing opera to be identified as mz
webfxLayout = {
writeTitle : function (s, s2) {
document.write("<div id='webfx-title-background'></div>"); if (op) {
document.write("<h1 id='webfx-title' style='top:9px;'>" + s + "</h1>");
} else {
document.write("<h1 id='webfx-title'>" + s + "</h1>");
}
if (s2 == null)
s2 = "WebFX - What you never thought possible!";
if (op) {
document.write("<span id='webfx-sub-title' style='top:46px;'>" + s2 + "</span>");
} else {
document.write("<span id='webfx-sub-title'>" + s2 + "</span>");
}
},
writeMainTitle : function () { this.writeTitle("WebFX", "What you never thought possible!");
},
writeTopMenuBar : function () {
document.write("<div id='webfx-menu-bar-1'></div>"); if (op) {
document.write("<style>.webfx-menu-bar a {padding-top:3px;}</style>");
document.write("<div id='webfx-menu-bar-2' style='height:2px;'></div>");
} else
document.write("<div id='webfx-menu-bar-2'></div>");
document.write("<div id='webfx-menu-bar'>");// div is closed in writeBottomMenuBar
},
writeBottomMenuBar : function () {
document.write("</div>"); if (op)
document.write("<div id='webfx-menu-bar-3' style='height:0px;'></div>"); else
document.write("<div id='webfx-menu-bar-3'></div>");
document.write("<div id='webfx-menu-bar-4'></div>");
document.write("<div id='webfx-menu-bar-5'></div>");
},
writeMenu : function () { this.writeTopMenuBar();
//document.write(webfxMenuBar);
document.write("<div class='webfx-menu-bar'><a href='http://webfx.eae.net'>WebFX Home</a></div>"); this.writeBottomMenuBar();
},
writeDesignedByEdger : function () { if (ie && document.body.currentStyle.writingMode != null)
document.write("<div id='webfx-about'>Page designed and maintained by " +
"<a href='mailto:[email protected]'>Erik Arvidsson</a> & " +
"<a href='mailto:[email protected]'>Emil A Eklund</a>.</div>");
}
};
if (ie && window.attachEvent) {
window.attachEvent("onload", function () {
var scrollBorderColor = "rgb(120,172,255)";
var scrollFaceColor = "rgb(234,242,255)";
with (document.body.style) {
scrollbarDarkShadowColor = scrollBorderColor;
scrollbar3dLightColor = scrollBorderColor;
scrollbarArrowColor = "black";
scrollbarBaseColor = scrollFaceColor;
scrollbarFaceColor = scrollFaceColor;
scrollbarHighlightColor = scrollFaceColor;
scrollbarShadowColor = scrollFaceColor;
scrollbarTrackColor = "white";
}
});
}
/* we also need some dummy constructors */
webfxMenuBar = {
add : function () {}
}; function WebFXMenu() { this.add = function () {};
} function WebFXMenuItem() {} function WebFXMenuSeparator() {} function WebFXMenuButton() {}
</script>
<!-- this link element includes the css definitions that describes the tab pane -->
<!--
<link type="text/css" rel="stylesheet" href="tab.winclassic.css" />
-->
<!-- tab.css -->
<style id="luna-tab-style-sheet" type="text/css" rel="stylesheet" disabled="disabled">
.dynamic-tab-pane-control.tab-pane {
position: relative;
width: 100%; /* width needed weird IE bug */
margin-right: -2px; /* to make room for the shadow */
}
<!-- tabpane.js -->
<script type="text/javascript">
/*----------------------------------------------------------------------------\
| Tab Pane 1.02 |
|-----------------------------------------------------------------------------|
| Created by Erik Arvidsson |
| (http://webfx.eae.net/contact.html#erik) |
| For WebFX (http://webfx.eae.net/) |
|-----------------------------------------------------------------------------|
| Copyright (c) 1998 - 2003 Erik Arvidsson |
|-----------------------------------------------------------------------------|
| This software is provided "as is", without warranty of any kind, express or |
| implied, including but not limited to the warranties of merchantability, |
| fitness for a particular purpose and noninfringement. In no event shall the |
| authors or copyright holders be liable for any claim, damages or other |
| liability, whether in an action of contract, tort or otherwise, arising |
| from, out of or in connection with the software or the use or other |
| dealings in the software. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| This software is available under the three different licenses mentioned |
| below. To use this software you must chose, and qualify, for one of those. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Non-Commercial License http://webfx.eae.net/license.html |
| Permits anyone the right to use the software in a non-commercial context |
| free of charge. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| The WebFX Commercial license http://webfx.eae.net/commercial.html |
| Permits the license holder the right to use the software in a commercial |
| context. Such license must be specifically obtained, however it's valid for |
| any number of implementations of the licensed software. |
| - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - |
| GPL - The GNU General Public License http://www.gnu.org/licenses/gpl.txt |
| Permits anyone the right to use and modify the software without limitations |
| as long as proper credits are given and the original and modified source |
| code are included. Requires that the final product, software derivate from |
| the original source or any software utilizing a GPL component, such as |
| this, is also licensed under the GPL license. |
|-----------------------------------------------------------------------------|
| 2002-01-?? | First working version |
| 2002-02-17 | Cleaned up for 1.0 public version |
| 2003-02-18 | Changed from javascript uri for anchors to return false |
| 2003-03-03 | Added dispose methods to release IE memory |
|-----------------------------------------------------------------------------|
| Dependencies: *.css a css file to define the layout |
|-----------------------------------------------------------------------------|
| Created 2002-01-?? | All changes are in the log above. | Updated 2003-03-03 |
\----------------------------------------------------------------------------*/
// This function is used to define if the browser supports the needed
// features function hasSupport() {
if (typeof hasSupport.support != "undefined") return hasSupport.support;
var ie55 = /msie 5\.[56789]/i.test( navigator.userAgent );
// IE55 has a serious DOM1 bug... Patch it! if ( ie55 ) {
document._getElementsByTagName = document.getElementsByTagName;
document.getElementsByTagName = function ( sTagName ) { if ( sTagName == "*" ) return document.all; else return document._getElementsByTagName( sTagName );
};
}
return hasSupport.support;
}
///////////////////////////////////////////////////////////////////////////////////
// The constructor for tab panes
//
// el : HTMLElement The html element used to represent the tab pane
// bUseCookie : Boolean Optional. Default is true. Used to determine whether to us
// persistance using cookies or not
// function WebFXTabPane( el, bUseCookie ) { if ( !hasSupport() || el == null ) return;
// loop through child nodes and add them
var cs = el.childNodes;
var n; for (var i = 0; i < cs.length; i++) { if (cs[i].nodeType == 1 && cs[i].className == "tab-page") { this.addTabPage( cs[i] );
}
}
}
WebFXTabPane.getCookie = function (sName) {
var re = new RegExp( "(\;|^)[^;]*(" + sName + ")\=([^;]*)(;|$)" );
var res = re.exec( document.cookie ); return res != null ? res[3] : null;
};
WebFXTabPane.removeCookie = function ( name ) {
setCookie( name, "", -1 );
};
///////////////////////////////////////////////////////////////////////////////////
// The constructor for tab pages. This one should not be used.
// Use WebFXTabPage.addTabPage instead
//
// el : HTMLElement The html element used to represent the tab pane
// tabPane : WebFXTabPane The parent tab pane
// nindex : Number The index of the page in the parent pane page array
// function WebFXTabPage( el, tabPane, nIndex ) { if ( !hasSupport() || el == null ) return;
var cs = el.childNodes; for (var i = 0; i < cs.length; i++) { if (cs[i].nodeType == 1 && cs[i].className == "tab") { this.tab = cs[i]; break;
}
}
// insert a tag around content to support keyboard navigation
var a = document.createElement( "A" ); this.aElement = a;
a.href = "#";
a.onclick = function () { return false; }; while ( this.tab.hasChildNodes() )
a.appendChild( this.tab.firstChild ); this.tab.appendChild( a );
// hook up events, using DOM0
var oThis = this; this.tab.onclick = function () { oThis.select(); }; this.tab.onmouseover = function () { WebFXTabPage.tabOver( oThis ); }; this.tab.onmouseout = function () { WebFXTabPage.tabOut( oThis ); };
}
WebFXTabPage.prototype.show = function () {
var el = this.tab;
var s = el.className + " selected";
s = s.replace(/ +/g, " ");
el.className = s;
this.element.style.display = "block";
};
WebFXTabPage.prototype.hide = function () {
var el = this.tab;
var s = el.className;
s = s.replace(/ selected/g, "");
el.className = s;
this.element.style.display = "none";
};
WebFXTabPage.prototype.select = function () { this.tabPane.setSelectedIndex( this.index );
};
WebFXTabPage.tabOver = function ( tabpage ) {
var el = tabpage.tab;
var s = el.className + " hover";
s = s.replace(/ +/g, " ");
el.className = s;
};
WebFXTabPage.tabOut = function ( tabpage ) {
var el = tabpage.tab;
var s = el.className;
s = s.replace(/ hover/g, "");
el.className = s;
};
// This function initializes all uninitialized tab panes and tab pages function setupAllTabs() { if ( !hasSupport() ) return;
var all = document.getElementsByTagName( "*" );
var l = all.length;
var tabPaneRe = /tab\-pane/;
var tabPageRe = /tab\-page/;
var cn, el;
var parentTabPane;
for ( var i = 0; i < l; i++ ) {
el = all[i]
cn = el.className;
// no className if ( cn == "" ) continue;
// uninitiated tab pane if ( tabPaneRe.test( cn ) && !el.tabPane ) new WebFXTabPane( el );
// unitiated tab page wit a valid tab pane parent else if ( tabPageRe.test( cn ) && !el.tabPage &&
tabPaneRe.test( el.parentNode.className ) ) {
el.parentNode.tabPane.addTabPage( el );
}
}
}
function disposeAllTabs() { if ( !hasSupport() ) return;
var all = document.getElementsByTagName( "*" );
var l = all.length;
var tabPaneRe = /tab\-pane/;
var cn, el;
var tabPanes = [];
for ( var i = 0; i < l; i++ ) {
el = all[i]
cn = el.className;
//MY FUNCTION: add a tab dinamically function addtab(t,id,target) {
tp1.addTabPage("mick");
/*
//the div containing the tab
var newtab = document.createElement('div');
newtab.id=id;
newtab.className="tab-page";
document.getElementById("tabPane1").appendChild(newtab);
//the tab's title
var titolo = document.createElement('h2');
titolo.innerHTML=t;
newtab.className="tab";
newtab.appendChild(titolo);
//add the script inside the tab (i think is wrong...)
var script = document.createElement('script');
script.defer = true;
script.type="text/javascript";
script.text=' tp1.addTabPage( document.getElementById( "'+id+'" ) ); ';
void(newtab.appendChild(script));
//add the frame inside the tab
var ifr = document.createElement('iframe');
ifr.style.width="100%";
ifr.style.height="100%";
ifr.src=target;
newtab.appendChild(ifr);
*/
}
</script>
<!-- Call the function: I'd like to add a tab to the tabPane -->
<a onclick="addtab('A great site!','tabPagexx1','http://webfx.eae.net');">ADD A WEBFX TAB</a><br><br>
<!-- the TabPane -->
<div class="tab-pane" id="tabPane1">
<script type="text/javascript">
tp1 = new WebFXTabPane( document.getElementById( "tabPane1" ) );
</script>
