- Home Page
- > Script DHTML
- > Script DHTML Menu
- > Top Navigational Bar
Top Navigational Bar
Microsoft style menu, highly personalizable
<html>
<head>
<title>Demo dhtml</title>
<meta content="text/html;charset=iso-8859-1" http-equiv="Content-Type">
<style type="text/css">.RBUnselected {
BACKGROUND-COLOR: #d3d3d3; BORDER-BOTTOM: #696969 thin solid; BORDER-LEFT: #f5f5f5
thin solid; BORDER-RIGHT: #696969 thin solid; BORDER-TOP: #f5f5f5 thin solid;
FONT-SIZE: 9pt; HEIGHT: 23px; WIDTH: 86px
}
.RBSelected {
BACKGROUND-COLOR: #ff0000; BORDER-BOTTOM-COLOR: #ff0000; BORDER-BOTTOM-STYLE:
none; BORDER-LEFT-COLOR: #ff0000; BORDER-LEFT-STYLE: none; BORDER-RIGHT-COLOR:
#ff0000; BORDER-RIGHT-STYLE: none; BORDER-TOP-COLOR: #ff0000; COLOR: #ffffff;
FONT-SIZE: 9pt; HEIGHT: 23px; WIDTH: 86px
}
</style>
</head>
<body aLink="#0074E8" bgColor="#FFFFFF" leftMargin="0" link="#0074E8" text="#000000" topMargin="0" vLink="#0074E8">
<p><a href name="Top"></a></p>
<!-- Start: ToolBar V2.0-->
<script language="JavaScript" src="scripts/toolbar.js"></script>
<script language="JavaScript"
src="scripts/global.js"></script>
<script language="JavaScript" src="scripts/local.js"></script>
<!-- Start: ToolBar for down-level browsers-->
<div
id="TBDownLevelDiv">
<table bgColor="#ffffff" border="0" cellPadding="0" cellSpacing="0" width="100%">
<TBODY>
<tr>
<td height="60" rowSpan="2" vAlign="top"></td>
<td align="right" height="20" vAlign="top"></td>
<td align="right" bgColor="#330099" height="20" noWrap
vAlign="center"><font
color="#ffffff" face="Verdana, Arial" size="1"><b> <a
href="http://www.ipoint2000.net/galileo"
style="COLOR: #ffffff; TEXT-DECORATION: none" target="_top">Galileo</a> <font
color="#ffffff">|</font> <font color="#ffffff">Libri</font> <font
color="#ffffff">|</font> Cerca
| <a
href="http://bisnuket.pcupdate.easyspace.com"
style="COLOR: #ffffff; TEXT-DECORATION: none" target="_top">Mailing
list</a>
</b></font></td>
</tr>
<tr>
<td height="40" vAlign="top" width="19"><img
alt border="0" height="40" src="scripts/1ptrans.gif"
width="19"></td>
<td align="right" height="40" noWrap vAlign="top"><a
href target="_top"><img alt="Bismark"
border="0" height="40" src="scripts/mslogo.gif" width="112"></a></td>
</tr>
</TBODY>
</table>
</div><!-- End: ToolBar For down-level browsers-->
<script language="JavaScript">
<!--// Hide from old browsers
var ToolBar_Supported = ToolBar_Supported;
if (ToolBar_Supported != null && ToolBar_Supported == true)
{
//setICPBanner("/italy/library/toolbar/images/mscom_bkstg_banner.gif","","Bismark");
TBDownLevelDiv.style.display ='none';
drawToolbar();
// To highlight current menu button, pass the appropriate values to the
// function: setICPMenuColor(MenuIDStr, bgColor, fontColor, mouseoverColor).
// For example,
// setICPMenuColor("HomeMenu", "blue", "", "");
}
//-->
</script>
<!-- End: ToolBar V2.0-->
<!-- add nav bar here -->
<!---->
<!--start toolbar-->
<script language="javascript">
function mOvr(src) { if (!src.contains(event.fromElement)){src.bgColor = '#000066';src.children(0).style.color='#FFCC66'}}
function mOut(src) { if (!src.contains(event.toElement)) {src.bgColor = '#CCCCFF';src.children(0).style.color='#000066'}}
</script>
<!--end toolbar-->
<!--RIGHT COLUMN END -->
</body></html>
File global.js
var ToolBar_Supported = ToolBar_Supported ;
if (ToolBar_Supported != null && ToolBar_Supported == true)
{
//To Turn on/off Instrumentation set DoInstrumentation = true/false.
DoInstrumentation= true;
// Customize default MS menu color - bgColor, fontColor, mouseoverColor
setDefaultMSMenuColor("#330099", "white", "red");
// Customize toolbar background color
//setToolbarBGColor("white");
// display default ICP Banner
// display ADS
//setAds("/library/toolbar/images/ADS/ad.gif","","")
;
//***** Add Standard menus *****
//ProductsMenu
addMSMenu("ProductsMenu", "Galileo", "","#");
addMSSubMenu("ProductsMenu","Libri","#");
addMSSubMenu("ProductsMenu","DHTML store","#");
addMSSubMenu("ProductsMenu","Mercatino","#");
addMSSubMenuLine("ProductsMenu");
addMSSubMenu("ProductsMenu","Internet & BBS","#");
addMSSubMenu("ProductsMenu","iPoint2000","#");
addMSSubMenu("ProductsMenu","ASP-it","#");
addMSSubMenu("ProductsMenu","Programmi-it","#");
addMSSubMenu("ProductsMenu","Betatester","#");
addMSSubMenu("ProductsMenu","Curiosità","#");
addMSSubMenuLine("ProductsMenu");
addMSSubMenu("ProductsMenu","DSB","#");
addMSSubMenu("ProductsMenu","PcSelf","#");
//SupportMenu
addMSMenu("SupportMenu", "Mailing list", "","#");
addMSSubMenu("SupportMenu","Una demo DHTML","#");
addMSSubMenu("SupportMenu","Newsletter","#");
addMSSubMenu("SupportMenu","Un sito al giorno","#");
//SearchMenu
addMSMenu("SearchMenu", "Altro", "","#");
addMSSubMenu("SearchMenu","Abbate","#");
//MicrosoftMenu
addMSMenu("MicrosoftMenu", "Radio con Ie 5.0", "","");
addMSSubMenu("MicrosoftMenu","Radio 101","#");
addMSSubMenu("MicrosoftMenu","Radio 105","#");
addMSSubMenu("MicrosoftMenu","Dimensione Suono","#");
addMSSubMenu("MicrosoftMenu","Rtl 102.5","#");
addMSSubMenuLine("MicrosoftMenu");
addMSSubMenu("MicrosoftMenu","Megamix96","#");
//Lock MSMenu so that ICP can't add make changes to it
//Lock("addMSMenu");
}
File local.js
var ToolBar_Supported = ToolBar_Supported ;
if (ToolBar_Supported != null && ToolBar_Supported == true)
{
//To Turn on/off Frame support, set Frame_Supported = true/false.
Frame_Supported = false;
// Customize default ICP menu color - bgColor, fontColor, mouseoverColor
setDefaultICPMenuColor("#CCCCFF", "#000066", "red");
// Customize toolbar background color
setToolbarBGColor("white");
// display ICP Banner
// setICPBanner("bnrWebEvents.gif","","Italy 1999")
;
//***** Add ICP menus *****
//Home
addICPMenu("HomeMenu", " home page web events (in lingua inglese) ", "","/default.asp");
}
File toolbar.js
var ToolBar_Supported = false;
var Frame_Supported = false;
var DoInstrumentation = false;
if (navigator.userAgent.indexOf("MSIE") != -1 &&
navigator.userAgent.indexOf("Windows") != -1 &&
navigator.appVersion.substring(0,1) > 3)
{
ToolBar_Supported = true;
}
if (ToolBar_Supported)
{
var newLineChar = String.fromCharCode(10);
var char34 = String.fromCharCode(34);
var LastMSMenu = "";
var CurICPMenu = "";
var IsMSMenu = false;
var IsMenuDropDown = true;
var HTMLStr;
var x = 0;
var y = 0;
var x2 = 0;
var y2 = 0;
var MSMenuWidth;
var ToolbarMinWidth;
var ToolbarMenu;
var ToolbarBGColor;
var ToolbarLoaded = false;
var aDefMSColor = new Array(3);
var aDefICPColor = new Array(3);
var aCurMSColor = new Array(3);
var aCurICPColor = new Array(3);
var MSFont;
var ICPFont;
var MaxMenu = 30;
var TotalMenu = 0;
var arrMenuInfo = new Array(30);
// Output style sheet and toolbar ID
document.write("<SPAN ID='StartMenu' STYLE='display:none;'></SPAN>");
// Build toolbar template
HTMLStr =
"<DIV ID='idToolbar' STYLE='background-color:white;width:100%'>" +
"<DIV ID='idRow1' STYLE='position:relative;height:20;'>" +
"<DIV ID='idICPBanner' STYLE='position:absolute;top:0;left:0;height:60;width:250;overflow:hidden;vertical-align:top;'><!--BEG_ICP_BANNER--><!--END_ICP_BANNER--></DIV>" +
"<DIV ID='idMSMenuCurve' STYLE='position:absolute;top:0;left:250;height:20;width:18;overflow:hidden;vertical-align:top;'></DIV>" +
"<DIV ID='idMSMenuPane' STYLE='position:absolute;top:0;left:250;height:20;width:10;background-color:black;float:right;'
NOWRAP><!--MS_MENU_TITLES--></DIV>" +
"</DIV>" +
"<DIV ID='idRow2' STYLE='position:relative;left:250;height:40;'>" +
"<DIV ID='idADSBanner' STYLE='position:absolute;top:0;left:0;height:40;width:200;vertical-align:top;overflow:hidden;'><!--BEG_ADS_BANNER--><!--END_ADS_BANNER--></DIV>" +
"<DIV ID='idMSCBanner' STYLE='position:absolute;top:0;left:200;height:40;width:112;vertical-align:top;overflow:hidden;'
ALIGN=RIGHT><!--BEG_MSC_BANNER--><!--END_MSC_BANNER--></DIV>" +
"</DIV>" +
"<SCRIPT TYPE='text/javascript'>" +
" var ToolbarMenu = StartMenu;" +
"</SCRIPT>" +
"<DIV WIDTH=100%>";
// Define event handlers
window.onresize = resizeToolbar;
// Intialize global variables
ToolbarBGColor = "white"; // toolbar background color
MSFont = "xx-small Verdana";
ICPFont = "bold x-small Arial";
aDefMSColor[0] = aCurMSColor[0] = "black"; // bgcolor;
aDefMSColor[1] = aCurMSColor[1] = "white"; // text font color
aDefMSColor[2] = aCurMSColor[2] = "red"; // mouseover font color
aDefICPColor[0] = aCurICPColor[0] = "#6699CC"; // bgcolor;
aDefICPColor[1] = aCurICPColor[1] = "white"; // text font color
aDefICPColor[2] = aCurICPColor[2] = "red"; // mouseover font color
}
// The hard-coded numbers in functions - drawToolbar() & resizeToolbar()
// correspond to the dimension of the four gif files:
// ICP_BANNER: 60h x 250w
// ADS_BANNER: 40h x 200w
// MSC_BANNER: 40h x 112w
// Curve: 20h x 18w
function drawToolbar()
{
HTMLStr += "</DIV>";
document.write(HTMLStr);
ToolbarLoaded = true;
MSMenuWidth = Math.max(idMSMenuPane.offsetWidth, (200+112));
ToolbarMinWidth = (250+18) + MSMenuWidth;
idToolbar.style.backgroundColor = ToolbarBGColor;
idMSMenuPane.style.backgroundColor = aDefMSColor[0];
resizeToolbar();
for (i = 0; i < TotalMenu; i++)
{
thisMenu = document.all(arrMenuInfo[i].IDStr);
if (thisMenu != null)
{
if (arrMenuInfo[i].IDStr == LastMSMenu && arrMenuInfo[i].type == "R")
{
//Last MSMenu has to be absolute width
arrMenuInfo[i].type = "A";
arrMenuInfo[i].unit = 200;
}
if (arrMenuInfo[i].type == "A")
thisMenu.style.width = arrMenuInfo[i].unit;
else
thisMenu.style.width = Math.round(arrMenuInfo[i].width * arrMenuInfo[i].unit)
+ 'em';
}
}
}
function resizeToolbar()
{
if (ToolBar_Supported == false) return;
w = Math.max(ToolbarMinWidth, document.body.clientWidth) - ToolbarMinWidth;
idMSMenuCurve.style.left = (250+w);
idMSMenuPane.style.left = (250+w+18);
idMSMenuPane.style.width = MSMenuWidth;
idADSBanner.style.left = (w+18);
idMSCBanner.style.left = (w+18+200);
idMSCBanner.style.width = (MSMenuWidth - 200);
}
function setToolbarBGColor(color)
{
ToolbarBGColor = color;
if (ToolbarLoaded == true)
idToolbar.style.backgroundColor = ToolbarBGColor;
}
function setMSMenuFont(sFont)
{ MSFont = sFont;
}
function setICPMenuFont(sFont)
{ ICPFont = sFont;
}
function setDefaultMSMenuColor(bgColor, fontColor, mouseoverColor)
{
if (bgColor != "") aDefMSColor[0] = bgColor;
if (fontColor != "") aDefMSColor[1] = fontColor;
if (mouseoverColor != "") aDefMSColor[2] = mouseoverColor;
}
function setDefaultICPMenuColor(bgColor, fontColor, mouseoverColor)
{
if (bgColor != "") aDefICPColor[0] = bgColor;
if (fontColor != "") aDefICPColor[1] = fontColor;
if (mouseoverColor != "") aDefICPColor[2] = mouseoverColor;
}
function setICPMenuColor(MenuIDStr, bgColor, fontColor, mouseoverColor)
{
if (ToolbarLoaded == false) return;
// Reset previous ICP Menu color if any
if (CurICPMenu != "")
{
PrevID = CurICPMenu.substring(4);
CurICPMenu = "";
setICPMenuColor(PrevID, aDefICPColor[0], aDefICPColor[1], aDefICPColor[2]);
}
var id = "AM_" + "ICP_" + MenuIDStr;
var thisMenu = document.all(id);
if (thisMenu != null)
{
CurICPMenu = "ICP_" + MenuIDStr;
aCurICPColor[0] = bgColor;
aCurICPColor[1] = fontColor;
aCurICPColor[2] = mouseoverColor;
// Change menu color
if (bgColor != "")
thisMenu.style.backgroundColor = bgColor;
if (fontColor != "")
thisMenu.style.color = fontColor;
// Change subMenu color
id = "ICP_" + MenuIDStr;
thisMenu = document.all(id);
if (thisMenu != null)
{
if (bgColor != "")
thisMenu.style.backgroundColor = bgColor;
if (fontColor != "")
{
i = 0;
id = "AS_" + "ICP_" + MenuIDStr;
thisMenu = document.all.item(id,i);
while (thisMenu != null)
{
thisMenu.style.color = fontColor;
i += 1;
thisMenu = document.all.item(id,i);
}
}
}
}
}
function setAds(Gif,Url,AltStr)
{ setBanner(Gif,Url,AltStr,"<!--BEG_ADS_BANNER-->","<!--END_ADS_BANNER-->");
}
function setICPBanner(Gif,Url,AltStr)
{ setBanner(Gif,Url,AltStr,"<!--BEG_ICP_BANNER-->","<!--END_ICP_BANNER-->");
}
function setMSBanner(Gif,Url,AltStr)
{ tempGif = "/images/" + Gif;
setBanner(tempGif,Url,AltStr,"<!--BEG_MSC_BANNER-->","<!--END_MSC_BANNER-->");
}
function setBanner(BanGif, BanUrl, BanAltStr, BanBegTag, BanEndTag)
{
begPos = HTMLStr.indexOf(BanBegTag);
endPos = HTMLStr.indexOf(BanEndTag) + BanEndTag.length;
SubStr = HTMLStr.substring(begPos, endPos);
SrcStr = "";
if (BanUrl != "")
SrcStr += "<A Target='_top' HREF='" + formatURL(BanUrl, BanGif)
+ "'>";
SrcStr += "<IMG SRC='" + BanGif + "' ALT='" + BanAltStr
+ "' BORDER=0>";
if (BanUrl != "")
SrcStr += "</A>";
SrcStr = BanBegTag + SrcStr + BanEndTag;
HTMLStr = HTMLStr.replace(SubStr, SrcStr);
}
function setICPSubMenuWidth(MenuIDStr, WidthType, WidthUnit)
{ tempID = "ICP_" + MenuIDStr;
setSubMenuWidth(tempID, WidthType, WidthUnit);
}
function setMSSubMenuWidth(MenuIDStr, WidthType, WidthUnit)
{ tempID = "MS_" + MenuIDStr;
setSubMenuWidth(tempID, WidthType, WidthUnit);
}
function setSubMenuWidth(MenuIDStr, WidthType, WidthUnit)
{
var fFound = false;
if (TotalMenu == MaxMenu)
{
alert("Unable to process menu. Maximum of " + MaxMenu + " reached.");
return;
}
for (i = 0; i < TotalMenu; i++)
if (arrMenuInfo[i].IDStr == MenuIDStr)
{
fFound = true;
break;
}
if (!fFound)
{
arrMenuInfo[i] = new menuInfo(MenuIDStr);
TotalMenu += 1;
}
if (!fFound && WidthType.toUpperCase().indexOf("DEFAULT") !=
-1)
{
arrMenuInfo[i].type = "A";
arrMenuInfo[i].unit = 160;
}
else
{
arrMenuInfo[i].type = (WidthType.toUpperCase().indexOf("ABSOLUTE")
!= -1)? "A" : "R";
arrMenuInfo[i].unit = WidthUnit;
}
}
// This function creates a menuInfo object instance.
function menuInfo(MenuIDStr)
{
this.IDStr = MenuIDStr;
this.type = "";
this.unit = 0;
this.width = 0;
this.count = 0;
}
function updateSubMenuWidth(MenuIDStr)
{
for (i = 0; i < TotalMenu; i++)
if (arrMenuInfo[i].IDStr == MenuIDStr)
{
if (arrMenuInfo[i].width < MenuIDStr.length)
arrMenuInfo[i].width = MenuIDStr.length;
arrMenuInfo[i].count = arrMenuInfo[i].count + 1;
break;
}
}
function addICPMenu(MenuIDStr, MenuDisplayStr, MenuHelpStr, MenuURLStr)
{
if (addICPMenu.arguments.length > 4)
TargetStr = addICPMenu.arguments[4];
else
TargetStr = "_top";
tempID = "ICP_" + MenuIDStr;
addMenu(tempID, MenuDisplayStr, MenuHelpStr, MenuURLStr, TargetStr, true);
}
function addMSMenu(MenuIDStr, MenuDisplayStr, MenuHelpStr, MenuURLStr)
{
TargetStr = "_top";
tempID = "MS_" + MenuIDStr;
addMenu(tempID, MenuDisplayStr, MenuHelpStr, MenuURLStr, TargetStr, false);
LastMSMenu = tempID;
}
function addMenu(MenuIDStr, MenuDisplayStr, MenuHelpStr, MenuURLStr, TargetStr,
bICPMenu)
{
cFont = bICPMenu? ICPFont : MSFont;
cColor0 = bICPMenu? aDefICPColor[0] : aDefMSColor[0];
cColor1 = bICPMenu? aDefICPColor[1] : aDefMSColor[1];
cColor2 = bICPMenu? aDefICPColor[2] : aDefMSColor[2];
tagStr = bICPMenu? "<!--ICP_MENU_TITLES-->" : "<!--MS_MENU_TITLES-->";
MenuStr = newLineChar;
if (bICPMenu == false && LastMSMenu != "")
MenuStr += "<SPAN STYLE='font:" + cFont + ";color:" +
cColor1 + "'>| </SPAN>";
MenuStr += "<A TARGET='" + TargetStr + "' TITLE='" + MenuHelpStr
+ "'" +
" ID='AM_" + MenuIDStr + "'" +
" STYLE='text-decoration:none;cursor:hand;font:" + cFont + ";background-color:" +
cColor0 + ";color:" + cColor1 + ";'";
if (MenuURLStr != "")
{
if (bICPMenu)
MenuStr += " HREF='" + formatURL(MenuURLStr, ("ICP_" + MenuDisplayStr))
+ "'";
else
MenuStr += " HREF='" + formatURL(MenuURLStr, ("MS_" + MenuDisplayStr))
+ "'";
}
else
MenuStr += " HREF='' onclick='window.event.returnValue=false;'";
MenuStr += " onmouseout=" + char34 + "mouseMenu('out' ,'" +
MenuIDStr + "'); hideMenu();" + char34 +
" onmouseover=" + char34 + "mouseMenu('over','" + MenuIDStr
+ "'); doMenu('"+ MenuIDStr + "');" + char34 + ">" +
" " + MenuDisplayStr + " </a>";
if (bICPMenu)
MenuStr += "<SPAN STYLE='font:" + cFont + ";color:" +
cColor1 + "'> |</SPAN>";
MenuStr += tagStr;
HTMLStr = HTMLStr.replace(tagStr, MenuStr);
setSubMenuWidth(MenuIDStr,"default",0);
}
function addICPSubMenu(MenuIDStr, SubMenuStr, SubMenuURLStr)
{
if (addICPSubMenu.arguments.length > 3)
TargetStr = addICPSubMenu.arguments[3];
else
TargetStr = "_top";
tempID = "ICP_" + MenuIDStr;
addSubMenu(tempID,SubMenuStr,SubMenuURLStr,TargetStr,true);
}
function addMSSubMenu(MenuIDStr, SubMenuStr, SubMenuURLStr)
{
TargetStr = "_top";
tempID = "MS_" + MenuIDStr;
addSubMenu(tempID,SubMenuStr,SubMenuURLStr,TargetStr,false);
}
function addSubMenu(MenuIDStr, SubMenuStr, SubMenuURLStr, TargetStr, bICPMenu)
{
cFont = bICPMenu? ICPFont : MSFont;
cColor0 = bICPMenu? aDefICPColor[0] : aDefMSColor[0];
cColor1 = bICPMenu? aDefICPColor[1] : aDefMSColor[1];
cColor2 = bICPMenu? aDefICPColor[2] : aDefMSColor[2];
var MenuPos = MenuIDStr.toUpperCase().indexOf("MENU");
if (MenuPos == -1) { MenuPos = MenuIDStr.length; }
InstrumentStr = MenuIDStr.substring(0 , MenuPos) + "|" + SubMenuStr;;
URLStr = formatURL(SubMenuURLStr, InstrumentStr);
var LookUpTag = "<!--" + MenuIDStr + "-->";
var sPos = HTMLStr.indexOf(LookUpTag);
if (sPos <= 0)
{
HTMLStr += newLineChar + newLineChar +
"<SPAN ID='" + MenuIDStr + "'" +
" STYLE='display:none;position:absolute;width:160;background-color:" +
cColor0 + ";padding-top:0;padding-left:0;padding-bottom:20;z-index:9;'" +
" onmouseout='hideMenu();'>";
if (Frame_Supported == false || bICPMenu == false)
HTMLStr += "<HR STYLE='position:absolute;left:0;top:0;color:" +
cColor1 + "' SIZE=1>";
HTMLStr += "<DIV STYLE='position:relative;left:0;top:8;'>";
}
TempStr = newLineChar +
"<A ID='AS_" + MenuIDStr + "'" +
" STYLE='text-decoration:none;cursor:hand;font:" + cFont + ";color:" +
cColor1 + "'" +
" HREF='" + URLStr + "' TARGET='" + TargetStr + "'" +
" onmouseout=" + char34 + "mouseMenu('out' ,'" + MenuIDStr
+ "');" + char34 +
" onmouseover=" + char34 + "mouseMenu('over','" + MenuIDStr
+ "');" + char34 + ">" +
" " + SubMenuStr + "</A><BR>" + LookUpTag;
if (sPos <= 0)
HTMLStr += TempStr + "</DIV></SPAN>";
else
HTMLStr = HTMLStr.replace(LookUpTag, TempStr);
updateSubMenuWidth(MenuIDStr);
}
function addICPSubMenuLine(MenuIDStr)
{
tempID = "ICP_" + MenuIDStr;
addSubMenuLine(tempID,true);
}
function addMSSubMenuLine(MenuIDStr)
{
tempID = "MS_" + MenuIDStr;
addSubMenuLine(tempID,false);
}
function addSubMenuLine(MenuIDStr, bICPMenu)
{
var LookUpTag = "<!--" + MenuIDStr + "-->";
var sPos = HTMLStr.indexOf(LookUpTag);
if (sPos > 0)
{
cColor = bICPMenu? aDefICPColor[1] : aDefMSColor[1];
TempStr = newLineChar + "<HR STYLE='color:" + cColor + "' SIZE=1>" +
LookUpTag;
HTMLStr = HTMLStr.replace(LookUpTag, TempStr);
}
}
function mouseMenu(id, MenuIDStr)
{
IsMSMenu = (MenuIDStr.toUpperCase().indexOf("MS_") != -1);
IsMouseout = (id.toUpperCase().indexOf("OUT") != -1);
if (IsMouseout)
{
color = IsMSMenu? aDefMSColor[1] : aDefICPColor[1];
if (MenuIDStr == CurICPMenu && aCurICPColor[1] != "")
color = aCurICPColor[1];
}
else
{
color = IsMSMenu? aDefMSColor[2] : aDefICPColor[2];
if (MenuIDStr == CurICPMenu && aCurICPColor[2] != "")
color = aCurICPColor[2];
}
window.event.srcElement.style.color = color;
}
function doMenu(MenuIDStr)
{
var thisMenu = document.all(MenuIDStr);
if (ToolbarMenu == null || thisMenu == null || thisMenu == ToolbarMenu)
{
window.event.cancelBubble = true;
return false;
}
// Reset dropdown menu
window.event.cancelBubble = true;
ToolbarMenu.style.display = "none";
showElement("SELECT");
showElement("OBJECT");
ToolbarMenu = thisMenu;
IsMSMenu = (MenuIDStr.toUpperCase().indexOf("MS_") != -1);
// Set dropdown menu display position
x = window.event.srcElement.offsetLeft +
window.event.srcElement.offsetParent.offsetLeft;
if (MenuIDStr == LastMSMenu)
x += (window.event.srcElement.offsetWidth - thisMenu.style.posWidth);
x2 = x + window.event.srcElement.offsetWidth;
y = (IsMSMenu)?
(idRow1.offsetHeight) :
(idRow1.offsetHeight + idRow2.offsetHeight + idRow3.offsetHeight);
thisMenu.style.top = y;
thisMenu.style.left = x;
thisMenu.style.clip = "rect(0 0 0 0)";
thisMenu.style.display = "block";
// delay 2 millsecond to allow the value of ToolbarMenu.offsetHeight be set
window.setTimeout("showMenu()", 2);
return true;
}
function showMenu()
{
if (ToolbarMenu != null)
{
IsMenuDropDown = (Frame_Supported && IsMSMenu == false)? false : true;
if (IsMenuDropDown == false)
{
y = (y - ToolbarMenu.offsetHeight - idRow3.offsetHeight);
if (y < 0) y = 0;
ToolbarMenu.style.top = y;
}
y2 = y + ToolbarMenu.offsetHeight;
ToolbarMenu.style.clip = "rect(auto auto auto auto)";
hideElement("SELECT");
hideElement("OBJECT");
}
}
function hideMenu()
{
if (ToolbarMenu != null && ToolbarMenu != StartMenu)
{
// Don't hide the menu if the mouse move between the menu and submenus
cY = event.clientY + document.body.scrollTop;
if ( (event.clientX >= (x+5) && event.clientX <= x2) &&
((IsMenuDropDown == true && cY > (y-10) && cY <= y2) ||
(IsMenuDropDown == false && cY >= y && cY <= (y2+10)) ))
{
window.event.cancelBubble = true;
return;
}
ToolbarMenu.style.display = "none";
ToolbarMenu = StartMenu;
window.event.cancelBubble = true;
showElement("SELECT");
showElement("OBJECT");
}
}
function hideElement(elmID)
{
for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent)
continue;
// Find the element's offsetTop and offsetLeft relative to the BODY tag.
objLeft = obj.offsetLeft;
objTop = obj.offsetTop;
objParent = obj.offsetParent;
while (objParent.tagName.toUpperCase() != "BODY")
{
objLeft += objParent.offsetLeft;
objTop += objParent.offsetTop;
objParent = objParent.offsetParent;
}
// Adjust the element's offsetTop relative to the dropdown menu
objTop = objTop - y;
if (x > (objLeft + obj.offsetWidth) || objLeft > (x + ToolbarMenu.offsetWidth))
;
else if (objTop > ToolbarMenu.offsetHeight)
;
else if (IsMSMenu && (y + ToolbarMenu.offsetHeight) <= 80)
;
else
obj.style.visibility = "hidden";
}
}
function showElement(elmID)
{
for (i = 0; i < document.all.tags(elmID).length; i++)
{
obj = document.all.tags(elmID)[i];
if (! obj || ! obj.offsetParent)
continue;
obj.style.visibility = "";
}
}
function formatURL(URLStr, InstrumentStr)
{
var tempStr = URLStr;
if (DoInstrumentation && URLStr != "" )
{
var ParamPos1 = URLStr.indexOf("?");
var ParamPos2 = URLStr.lastIndexOf("?");
var ParamPos3 = URLStr.toLowerCase().indexOf("target=");
var ParamPos4 = URLStr.indexOf("#");
var Bookmark = "";
var URL = URLStr;
if (ParamPos4 >= 0)
{
URL = URLStr.substr(0, ParamPos4);
Bookmark = URLStr.substr(ParamPos4);
}
if (ParamPos1 == -1)
tempStr = "?MSCOMTB=";
else if (ParamPos1 == ParamPos2 && ParamPos3 == -1)
tempStr = "&MSCOMTB=";
else if (ParamPos1 == ParamPos2 && ParamPos3 != -1)
tempStr = "?MSCOMTB=";
else if (ParamPos1 < ParamPos2)
tempStr = "&MSCOMTB=";
tempStr = URL + tempStr + InstrumentStr.replace(" ","%20")
+ Bookmark;
}
return tempStr;
}
A colpo d'occhio
Be Responsive
HTML 5
HTML 5 è un linguaggio di markup utilizzato per la strutturazione e il contenuto delle pagine Web.
CSS 3
CSS 3 è l'ultima evoluzione dei fogli di stile CSS. Contiene molte novità come angoli arrotondati, ombre, sfumature, transizioni o animazioni.
jQuery
jQuery è una libreria JavaScript cross-platform progettata per semplificare lo scripting lato client.