»
EnglishFrenchVietnamese

Print - Tab Folder script - JavaScriptBank.com

Full version: jsB@nk » Utility » Generator » Tab Folder script
URL: http://www.javascriptbank.com/tab-folder-script.html

Tab Folder script © JavaScriptBank.comUsing a tabbed interface, this DHTML script lets you display external web pages inline on your page.

Full version: jsB@nk » Utility » Generator » Tab Folder script
URL: http://www.javascriptbank.com/tab-folder-script.html



CSS
<STYLE type=text/css>UNKNOWN {COLOR: black; TEXT-DECORATION: none}A:visited {COLOR: purple; TEXT-DECORATION: none}A:active {COLOR: blue; TEXT-DECORATION: none}TABLE.menu {FONT-SIZE: 11px; MARGIN: 2px; WIDTH: 600px; FONT-FAMILY: arial}TABLE.inline {BORDER-RIGHT: #ffffff 2px inset; BORDER-TOP: #ffffff 2px inset; BORDER-LEFT: #ffffff 2px inset; BORDER-BOTTOM: #ffffff 2px inset}TD.default {BORDER-RIGHT: #ffffff 2px outset; PADDING-RIGHT: 2px; BORDER-TOP: #ffffff 2px outset; PADDING-LEFT: 2px; FONT-WEIGHT: bold; PADDING-BOTTOM: 2px; MARGIN: 5px 5px 0px; VERTICAL-ALIGN: bottom; BORDER-LEFT: #ffffff 2px outset; CURSOR: default; PADDING-TOP: 4px; BORDER-BOTTOM: #cccccc 1px solid}TD.menu {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: bottom; CURSOR: default; PADDING-TOP: 5px; BORDER-BOTTOM: #ffffff 2px inset}TD.outline {BORDER-RIGHT: #ffffff 2px outset; PADDING-RIGHT: 10px; BORDER-TOP: 0px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; MARGIN: 10px; BORDER-LEFT: #ffffff 2px outset; PADDING-TOP: 20px; BORDER-BOTTOM: #ffffff 2px outset; HEIGHT: 400px}SPAN.left {BORDER-RIGHT: 0px; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 2px outset; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 5px 0px 0px; BORDER-LEFT: #ffffff 2px outset; PADDING-TOP: 2px; BORDER-BOTTOM: 0px}SPAN.right {BORDER-RIGHT: #ffffff 2px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 2px outset; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 5px 0px 0px; BORDER-LEFT: 0px; PADDING-TOP: 2px; BORDER-BOTTOM: 0px}SPAN.menu {BORDER-RIGHT: #ffffff 2px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 2px outset; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 5px 0px 0px; BORDER-LEFT: #ffffff 2px outset; PADDING-TOP: 2px; BORDER-BOTTOM: 0px}SPAN.default {BORDER-RIGHT: #ffffff 1px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 1px outset; PADDING-LEFT: 0px; FONT-WEIGHT: bold; FONT-SIZE: 12px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: #ffffff 1px outset; WIDTH: auto; PADDING-TOP: 2px; BORDER-BOTTOM: #ffffff 0px outset; FONT-FAMILY: arial}SPAN.n4menu {BORDER-RIGHT: #ffffff 1px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 1px outset; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: #ffffff 1px outset; WIDTH: auto; PADDING-TOP: 0px; BORDER-BOTTOM: #ffffff 1px outset; FONT-FAMILY: arial}SPAN.n4left {BORDER-RIGHT: #ffffff 0px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 1px outset; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: #ffffff 1px outset; WIDTH: auto; PADDING-TOP: 0px; BORDER-BOTTOM: #ffffff 1px outset; FONT-FAMILY: arial}SPAN.n4right {BORDER-RIGHT: #ffffff 1px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 1px outset; PADDING-LEFT: 0px; FONT-SIZE: 11px; PADDING-BOTTOM: 0px; MARGIN: 0px; BORDER-LEFT: #ffffff 0px outset; WIDTH: auto; PADDING-TOP: 0px; BORDER-BOTTOM: #ffffff 1px outset; FONT-FAMILY: arial}SPAN.line {BORDER-RIGHT: #ffffff 0px outset; PADDING-RIGHT: 0px; BORDER-TOP: #ffffff 0px outset; PADDING-LEFT: 0px; PADDING-BOTTOM: 1px; MARGIN: 0px 0px 1px; BORDER-LEFT: #ffffff 0px outset; WIDTH: 20px; PADDING-TOP: 0px; BORDER-BOTTOM: #ffffff 1px outset}</STYLE><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


JavaScript
<SCRIPT language=javascript>           <!--           /* You might use this code or modify to the way you need to use in your page if it is for indivuals or non-profit organiztions..              you can email me at sienal@hotmail.com for any question and feeback.. hope this script can provide any help in your website */                        /* this part from here should not be removed */                var menuItem = new Array("Option 1","Option 2","Option 3", "Option 4", "Option 5");   var currentTab = 0;   var objSelect = null;   var objAddText = null;      function build_menu() {      var menuBuilder;  var menuArea = document.all ? document.all('tabFolder'):document.layers['tabFolder'];  if (document.all) {     menuBuilder = ie_menu(currentTab);     menuArea.innerHTML = menuBuilder;       } else {     menuBuilder = n4_menu(currentTab)     menuArea.document.open(); menuArea.document.write(menuBuilder); menuArea.document.close();  } // detect ie or n4   } // setup menu       function ie_menu (thismenu) {      var builder;  builder = "<table class=menu border=0 cellspacing=0 cellpadding=0><tr>";  for (var i=0; i < menuItem.length; i++) {     if (thismenu==i) {     builder+="<td class=default onCLick='menu_click("+i+")' nowrap>&nbsp;"+menuItem[i]+"&nbsp;</td>";      } else {   /* if (i==0) { builder+="<td class=fillup>&nbsp;&nbsp;</td>"; } */    if (i==thismenu-1) { // left side menu    builder+=((i==0) ? "<td class=menu nowrap>":"")+"<span class=left onClick='menu_click("+i+")'>&nbsp;"+menuItem[i]+"&nbsp;</span></td>";    } else if (i==thismenu+1) { // right side menu    builder+="<td class=menu nowrap><span class=right onClick='menu_click("+i+")'>&nbsp;"+menuItem[i]+"&nbsp;</span>"+((i==menuItem.length)?"</td>":"");} else {          builder+=((i==0)?"<td class=menu nowrap>":"")+"<span class=menu onClick='menu_click("+i+")'>&nbsp;"+menuItem[i]+"&nbsp;</span>"+((i==menuItem.length)?"</td>":"");} // else .. }  } // for ..  builder += "<td width=100% class=menu align=right>&nbsp;<font size=-1 color=#cccccc>created by allen change</font></td><tr><td colspan=4 class=outline><table class=inline width=100% height=100% bgcolor=white><tr><td>&nbsp;</td></tr></table></td></tr></tr></table>";    return builder   } // ie_menu      function n4_menu (thismenu) {      var builder, classStr;  builder = "<table class=menu border=0 cellspacing=0 cellpadding=0><tr>";  for (var i=0; i < menuItem.length; i++) {     classStr = (i==thismenu) ? "default" : ((i==thismenu-1) ? "n4left" : ((i==thismenu+1) ? "n4right" : "n4menu")); builder+="<td valign=bottom><span class="+classStr+"><a href='javascript:menu_click("+i+")'>&nbsp;"+encode_blank(menuItem[i])+"&nbsp;</a></span></td>";   } // for ..  builder += "<td valign=bottom><span class=line>&nbsp;<font size=-1 color=#cccccc>created&nbsp;by&nbsp;allen&nbsp;change</font></span></td></tr><tr><td colspan="             +(menuItem.length+1)+"><table border=1 cellspacing=0 cellpadding=0 width=100% height=300><tr><td>&nbsp;</td></tr></table></td></tr></table>";   return builder    } // ie_menu      function menu_click(num) {      if (currentTab != num) {     currentTab = num;     build_menu();      } // if   } // menu_Clcik                        function encode_blank(str) {     var returnStr="";     for (var i = 0; i < str.length; i++) {    returnStr+= (str.charAt(i)==" ") ? "&nbsp;" : str.charAt(i);  } // for.. return returnStr;   } //decode_blank()..            /* this part up here should not be removed */      function setup_menu(type,msg) {      if (objSelect==null) { objSelect = (document.all) ? document.all('selmenu') : document['display'].document.forms[0].menu; }      if (objAddText==null) { objAddText = (document.all) ? document.all('addtext') : document['display'].document.forms[0].add; }  switch (type) {     case "initial":  currentTab=1;  break;     case "add":      if (!(msg>="0")) { return; }      menuItem[menuItem.length] = msg;  break;     case "delete":      if (msg<0) { return; }      for (var i = msg; i < menuItem.length - 1; i++) {      menuItem[i]=menuItem[i+1];  } //for  menuItem.length = menuItem.length - 1;  if (currentTab>msg || currentTab>=menuItem.length - 1) {       currentTab=(msg+1>=menuItem.length - 1) ? menuItem.length - 1 : currentTab-1;       } // if..  break; default:  } // switch(type)  build_menu();      load_combo();   } // setup_menu      function load_combo() {  objSelect.length=1;      for (var i = 0; i < menuItem.length; i++) { var newoption = new Option(menuItem[i], i, true, true);             objSelect.options[i+1] = newoption;  } // for..  objSelect.selectedIndex=0;   }      //-->   </SCRIPT><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->


HTML
<BODY bgcolor=#cccccc onload="setup_menu('initial', 1)"><SELECT id=selmenu name=menu><OPTION         value=-1 selected>---select tab item---</OPTION>    </SELECT><INPUT onclick="setup_menu('delete', objSelect.selectedIndex - 1)" type=button value=delete name=delete>     <INPUT id=addtext name=add size="20"><INPUT onclick="setup_menu('add', objAddText.value)" type=button value=add name=addBtn> <DIV id=tabFolder style="Z-INDEX: -1; LEFT: 10px; POSITION: relative; TOP: 7px"><!-- tabl folder goese here --></DIV></BODY><!--    This script downloaded from www.JavaScriptBank.com    Come to view and download over 2000+ free javascript at www.JavaScriptBank.com-->