Jumat, 22 Mei 2026

Flyout Menu With HTML COMPONENT, JScript, and XML (No SubMenu)

 







default.html

<HTML><HEAD>

<style>

.flyoutMenu {

BACKGROUND-COLOR: #f1f1f1; BEHAVIOR: url(default.htc); BORDER-BOTTOM: #999999 1px solid; BORDER-LEFT: #999999 0px solid; BORDER-RIGHT: #999999 1px solid; BORDER-TOP: #999999 0px solid

}

.flyoutHeading {

BACKGROUND-COLOR: #f1f1f1; CURSOR: default; FONT-FAMILY: Verdana, Arial, Helvetica; FONT-SIZE: 80%; FONT-WEIGHT: bold; PADDING-BOTTOM: 4px; PADDING-LEFT: 2px; PADDING-TOP: 2px

}

.flyoutLink {

BORDER-BOTTOM: #f1f1f1 1px solid; BORDER-LEFT: #f1f1f1 1px solid; BORDER-RIGHT: #f1f1f1 1px solid; BORDER-TOP: #f1f1f1 1px solid; CURSOR: hand; FONT-FAMILY: Verdana, Arial, Helvetica; FONT-SIZE: 80%; PADDING-LEFT: 6px; PADDING-RIGHT: 25px; PADDING-TOP: 1px

}

.flyoutMenu TD.flyoutLink {

BORDER-BOTTOM: #f1f1f1 1px solid; BORDER-LEFT: #f1f1f1 1px solid; BORDER-RIGHT: #f1f1f1 1px solid; BORDER-TOP: #f1f1f1 1px solid; CURSOR: hand; FONT-FAMILY: Verdana, Arial, Helvetica; FONT-SIZE: 80%; PADDING-BOTTOM: 3px; PADDING-LEFT: 6px; PADDING-RIGHT: 25px; PADDING-TOP: 1px

}

.flyoutLink A {

COLOR: black; TEXT-DECORATION: none

}

.flyoutLink A:hover {

COLOR: black; TEXT-DECORATION: none

}

.flyoutLink A:visited {

COLOR: black; TEXT-DECORATION: none

}

.flyoutLink A:active {

COLOR: black; TEXT-DECORATION: none

}

.flyoutSubHeading {

BACKGROUND-COLOR: #f1f1f1; CURSOR: default; FONT-FAMILY: Verdana, Arial, Helvetica; FONT-SIZE: 90%; FONT-WEIGHT: bold; PADDING-BOTTOM: 4px; PADDING-LEFT: 7px; PADDING-TOP: 2px

}

.flyoutSubLink {

BORDER-BOTTOM: #f1f1f1 1px solid; BORDER-LEFT: #f1f1f1 1px solid; BORDER-RIGHT: #f1f1f1 1px solid; BORDER-TOP: #f1f1f1 1px solid; CURSOR: hand; FONT-FAMILY: Verdana, Arial, Helvetica; FONT-SIZE: 90%; PADDING-BOTTOM: 3px; PADDING-LEFT: 11px; PADDING-RIGHT: 15px; PADDING-TOP: 1px

}

.flyoutSubLink A {

COLOR: black; TEXT-DECORATION: none

}

.flyoutSubLink A:hover {

COLOR: black; TEXT-DECORATION: none

}

.flyoutSubLink A:visited {

COLOR: black; TEXT-DECORATION: none

}

.flyoutSubLink A:active {

COLOR: black; TEXT-DECORATION: none

}

</style>

</head>

<BODY bgColor=#cccccc leftMargin=10 text=#000000 topMargin=10>

<h1>FLYOUT MENU</H1>

<TABLE border=0 cellPadding=2 cellSpacing=0 class=flyoutMenu 

            width=180 xmlns:msxsl="urn:schemas-microsoft-com:xslt" 

            menudata="menu.xml">

              <TBODY>

              <TR>

                <TD>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="pt"><A 

                        href="metacreations.html">Metacreations 

                       </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="directx.html">Direct X 

                        </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="kode.html">Code Center</A> 

                      </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="dl"><A 

                        href="dhtml.html">DHTML</A> 

                      </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="ht"><A 

                        href="javascript.html">Java Script

                        </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="mg"><A 

                        href="animation.html">Animation 3D 

                        </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="col"><A 

                        href="dom.html">DOM 

                        </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="css.html">CSS</A> 

                    </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="devcom"><A 

                        href="xml.html">XML 

                        </A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="train"><A 

                        href="http://msdn.microsoft.com/tce/">Training, Career 

                        &amp; Events</A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle="subscr"><A 

                        href="http://msdn.microsoft.com/subscriptions/">Subscriptions</A> 

                      </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="http://msdn.microsoft.com/partners/">Partners 

                        &amp; Certification</A> 

              </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

            <TABLE border=0 cellPadding=2 cellSpacing=0 class=flyoutMenu 

            width=180 xmlns:msxsl="urn:schemas-microsoft-com:xslt" 

            menudata="/menu.xml">

              <TBODY>

              <TR>

                <TD>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="http://msdn.microsoft.com/isapi/gomscom.asp?target=/technet/">IT 

                        Professionals</A> </TD></TR></TBODY></TABLE>

                  <TABLE border=0 cellPadding=0 cellSpacing=0 width=175>

                    <TBODY>

                    <TR>

                      <TD class=flyoutLink handle=""><A 

                        href="http://msdn.microsoft.com/architecture/">Architects</A> 

                      </TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE>

</body>

</html>

===================================================

File : default.htc

<PUBLIC:COMPONENT>

<PUBLIC:PROPERTY NAME="menudata" />
<PUBLIC:METHOD NAME="show_flyout" />
<PUBLIC:METHOD NAME="kill_flyout" />
<PUBLIC:METHOD NAME="scroll" />
<PUBLIC:METHOD NAME="event_oncontentready" />
<PUBLIC:ATTACH EVENT="oncontentready" ONEVENT="event_oncontentready()" />

<SCRIPT language="JScript">
// modified by Dudi Gunawan graduated from UNIVERSITAS PENDIDIKAN INDONESIA, Bandung/////
// Copyright © 2001 Microsoft Corporation////////
// file name default.htc///

var IMAGES = ""
var MENU_WIDTH = 180
var MENU_BORDER_COLOR = '#999999'
var MENU_BACKGROUND_COLOR = '#ffffff'
var MENU_CURRENTPAGE_COLOR = '#ffffff'
var MENU_MOUSEOVER_COLOR = '#ffffff'
var MENU_MOUSEDOWN_COLOR = 'rgb(111,183,255)'
var MENU_SHADOW_COLOR = '#666666'
var FLYOUT_DELAY = 200
var KILL_DELAY = 300
var SCROLL_DELAY = 35
var SCROLL_PXPERSEC = 150
var MIN_FLYOUT_WIDTH = 100
var MAX_FLYOUT_WIDTH = 410

var global = window.document
global.fo_currentMenu = null
global.fo_shadows = new Array
global.fo_killTimer = null

var flyoutTimer = null
var scrollTimer = null
var flyoutCount = 0
var flyouts = new Array
var rowHeight = 0
var menuToShow = null
var scrollDelta = 0
var scrollStart = 0
var scrollTime = 0
var scrollArea = null
var contentReady = 0
var hideIFrames = true

function newid()
{
var id
do
id = 'id' + Math.random().toString().substr(2, 10)
while (global.all(id))
return id
}

function new_XML_document()
{
try
{
var doc = new ActiveXObject("MSXMl.DOMDocument")
return doc
}
catch(err)
{
return null
}
}

function event_oncontentready()
{
if (!global.firstFlyoutInstance)
{
global.firstFlyoutInstance = true
global.body.attachEvent("onmousemove", body_onmousemove)
}
if (this.id == '')
this.id = newid()
if (navigator.appVersion.indexOf("MSIE 5.0") == -1)
hideIFrames = false
var mdd = null
if (menudata)
if (menudata.substr(0, 1) == '#')
{
try 
{
mdd = eval(menudata.substr(1)).XMLDocument.documentElement
}
catch(ex)
{
window.setTimeout(this.id + ".event_oncontentready()", 100, "JScript")
return
}
}
else
{
var md = new_XML_document()
if (md)
{
md.async = false
md.load(menudata)
if (md.parseError.errorCode == 0)
mdd = md.documentElement
}
else
mdd = null
}

var items = this.all.tags("TD")
var i
var nParentItem = 0
var nParentLen = -1
var lhref = normalized_href(location.href)

for (i=0; i<items.length; i++)
{
var item = items[i]
if (item.className == "flyoutLink" || item.className == "flyoutSubLink")
{
var disabled = false
var anchors = item.all.tags("A")
if (anchors.length > 0)
{
var anchor = anchors.item(0)
var ahref = normalized_href(anchor.href)
if (ahref == lhref)
{
anchor.outerHTML = anchor.innerHTML
item.style.borderColor = MENU_BORDER_COLOR
item.style.backgroundColor = MENU_CURRENTPAGE_COLOR
item.style.cursor = 'default'
disabled = true
nParentItem = 0
nParentLen = 9999
}
else 
{
var slash = ahref.lastIndexOf("/")
if (slash == ahref.length - 1)
if (lhref.substr(0, slash + 1) == ahref)
if (ahref.length > nParentLen)
{
nParentItem = i
nParentLen = ahref.length
}
}
}
item.defaultBorder = item.style.borderColor
item.defaultBackground = item.style.backgroundColor
item.attachEvent("onmouseover", item_onmouseover)
item.attachEvent("onmouseout", item_onmouseout)
if (!disabled)
{
item.attachEvent("onmousedown", item_onmousedown)
item.attachEvent("onmouseup", item_onmouseup)
}
if (item.handle && mdd)
{
var sm = mdd.selectSingleNode("//submenu[@handle='" + item.handle + "']")
if (sm)
{
var fa = document.createElement("div")
fa.width = 4
fa.height = 7
fa.style.position = "absolute"
fa.style.left = MENU_WIDTH - 15
fa.style.marginTop = 4
fa.style.fontSize = "1px"
fa.style.backgroundImage = "url(" + IMAGES + "flyout_arrow.bmp)"
fa.style.width = "4px"
fa.style.height = "7px"
item.insertAdjacentElement("afterBegin", fa)
var table = document.createElement("table") //submenu
table.attachEvent("onmouseover", submenu_onmouseover)
table.attachEvent("onmouseout", submenu_onmouseout)
table.width = MAX_FLYOUT_WIDTH + 6
table.cellPadding = 0
table.cellSpacing = 0
table.className = "flyoutMenu"
table.style.border = "solid 1px " + MENU_BORDER_COLOR
table.style.position = "absolute"
table.style.left = MENU_WIDTH - 4
table.style.top = 0
table.baseTop = element_top(item) - 3
cell = table.insertRow().insertCell()
cell.style.padding = "2px 0px"
scrollArea = document.createElement("div")
scrollArea.id = newid()
cell.insertAdjacentElement("afterBegin", scrollArea)

upScroller = create_sublink('<center><div style="width: 15px; height: 16px; font-size: 1px"></div></center>')
upScroller.style.display = 'none'
upScroller.rows[0].cells[0].scroller = scrollArea
cell.insertAdjacentElement("afterBegin", upScroller)
downScroller = create_sublink('<center><div style="width: 15px; height: 16px; font-size: 1px"></div></center>')
downScroller.style.display = 'none'
downScroller.rows[0].cells[0].scroller = scrollArea
cell.insertAdjacentElement("beforeEnd", downScroller)
scrollArea.upScroller = upScroller
scrollArea.downScroller = downScroller

var it = sm.firstChild
var ic = 0
var j
var mi //menu item
while (it)
{
ic++
var tn = it.tagName
var att = it.attributes
if (tn == 'item')
{
var h = '<a href="' + att.getNamedItem("href").value + '">' + att.getNamedItem("label").value + '</a>'
mi = create_sublink(h)
}
else if (tn == 'heading')
mi = create_sublink(att.getNamedItem("label").value, "flyoutSubHeading")
else if (tn == 'separator')
mi = create_separator()
else
mi = create_sublink("", "flyoutSubHeading")
scrollArea.insertAdjacentElement('beforeEnd', mi)
it = it.nextSibling
}
global.body.insertAdjacentElement('afterBegin', table)
item.flyoutid = flyoutCount
flyouts[flyoutCount++] = table
var maxWidth = MIN_FLYOUT_WIDTH
for (j=0; j<ic; j++)
{
mi = scrollArea.childNodes(j)
if (mi.offsetWidth > maxWidth) 
maxWidth = mi.offsetWidth
}
if (maxWidth > MAX_FLYOUT_WIDTH)
maxWidth = MAX_FLYOUT_WIDTH
table.width = ''

rowHeight = scrollArea.childNodes(0).offsetHeight
for (j=0; j<ic; j++)
{
mi = scrollArea.childNodes(j)
mi.style.width = maxWidth + mi.widthAdjust
}

upScroller.style.width = maxWidth
downScroller.style.width = maxWidth
table.style.display = "none"
}
}
}
}
if (nParentItem != 0)
{
items[nParentItem].style.borderColor = MENU_BORDER_COLOR
items[nParentItem].defaultBorder = MENU_BORDER_COLOR
}
}

function normalized_href(href)
{
href = href.toLowerCase();
var slash = href.lastIndexOf("/");
if (-1 != slash) 
{
var filename = href.substr(slash + 1);
if ("default.htm" == filename || "default.asp" == filename)
href = href.substr(0, slash + 1);
}
return href;
}

function image_load(src)
{
var img = new Image()
img.src = src
return img
}

function item_onmouseover()
{
var e = whichItem()
if (e.contains(window.event.fromElement))
return
if (e.style.backgroundColor != MENU_CURRENTPAGE_COLOR)
{
e.style.borderColor = MENU_BORDER_COLOR
e.style.backgroundColor = MENU_MOUSEOVER_COLOR
}
if (e.submenu == null)
{
if (e.handle)
{
menuToShow = flyouts[e.flyoutid]
if (menuToShow)
menuToShow.baseTop = element_top(e) - 3
}
else
menuToShow = null
flyoutTimer = window.setTimeout(this.id + ".show_flyout()", FLYOUT_DELAY, "JScript")
}
else if (scrollArea = e.scroller) //not a "==" typo
{
if (e.offsetParent.offsetTop > scrollArea.offsetTop)
scrollDelta = +1
else
scrollDelta = -1
scrollStart = scrollArea.scrollTop
scrollTime = current_time()
scrollTimer = window.setInterval(this.id + ".scroll()", SCROLL_DELAY, "JScript")
}
var a = e.all.tags("A")
if (a.length > 0)
window.status = a[0].href
}

function current_time()
{
var temp = new Date()
return temp.valueOf()
}

function item_onmouseout()
{
var e = whichItem()
var te = window.event.toElement
if (te)
if (e.contains(te))
return
e.style.borderColor = e.defaultBorder
e.style.backgroundColor = e.defaultBackground
if (flyoutTimer)
{
window.clearTimeout(flyoutTimer)
flyoutTimer = null
}
if (gs = scrollTimer)
{
window.clearInterval(gs)
scrollTimer = null
}
window.status = ""
}

function whichItem()
{
var e = event.srcElement
while (e.tagName != "TD")
e = e.parentElement
return e
}

function item_onmousedown()
{
if ((event.button & 1) == 0)
return;
var e = whichItem()
e.style.backgroundColor = MENU_MOUSEDOWN_COLOR
e.mouseIsDown = 1
}

function item_onmouseup()
{
if ((event.button & 1) == 0)
return;
var e = whichItem()
if (e.mouseIsDown != 1)
return
e.mouseIsDown = false
e.style.backgroundColor = MENU_MOUSEOVER_COLOR
var a = e.all.tags("A")
if (a.length > 0)
top.location.href = a[0].href
}

function scroll()
{
var temp = scrollStart + Math.round((current_time() - scrollTime) * 0.001 * SCROLL_PXPERSEC) * scrollDelta
scrollArea.scrollTop = temp
upImg = scrollArea.upScroller.all.tags("DIV").item(0)
dnImg = scrollArea.downScroller.all.tags("DIV").item(0)
if (temp <= 0)
upImg.style.backgroundImage = "url(" + IMAGES + "ico_wir_xp1.bmp)"
else
upImg.style.backgroundImage = "url(" + IMAGES + "ico_support_xp.bmp)"
if (temp >= scrollArea.scrollHeight - scrollArea.offsetHeight)
dnImg.style.backgroundImage = "url(" + IMAGES + "ico_wir_xp.bmp)"
else
dnImg.style.backgroundImage = "url(" + IMAGES + "ico_support_xp1.bmp)"
if (scrollArea.scrollTop != temp)
{
window.clearInterval(scrollTimer)
scrollTimer = null
}
}

function remove_flyout()
{
if (global.fo_currentMenu)
{
var i
for (i=0; i<global.fo_shadows.length; i++)
global.fo_shadows[i].removeNode(true);
global.fo_shadows = new Array();
global.fo_currentMenu.style.display = 'none'
show_elements("SELECT")
show_elements("OBJECT")
if (hideIFrames) show_elements("IFRAME")
}
}

function show_flyout()
{
flyoutTimer = null
if (global.readyState != 'complete')
{
flyoutTimer = window.setTimeout(this.id + ".show_flyout()", 50, "JScript")
return
}
if (global.fo_currentMenu == menuToShow)
return

remove_flyout()

global.fo_currentMenu = menuToShow

if (menuToShow)
{
var menuChildren = menuToShow.rows[0].cells[0].childNodes
var upScroller = menuChildren(0).style
var scrollArea = menuChildren(1).style
var downScroller = menuChildren(2).style

upScroller.display = 'none'
downScroller.display = 'none'
scrollArea.overflow = 'visible'

var menuStyle = menuToShow.style
menuStyle.zIndex = 10
menuStyle.top = menuToShow.baseTop
menuStyle.display = ''

var docBody = global.body
var docTop = docBody.scrollTop
var screenHeight = docBody.clientHeight

if (menuStyle.posTop - docTop + menuToShow.offsetHeight > screenHeight)
{
menuStyle.posTop -= menuToShow.offsetHeight - 25
if (menuStyle.posTop < docTop)
{
menuStyle.posTop = (screenHeight - menuToShow.offsetHeight) / 2 + docTop - 2
if (menuStyle.posTop < docTop)
{
upScroller.display = '';
menuChildren(0).all.tags("DIV").item(0).style.backgroundImage = "url(" + IMAGES + "ico_wir_xp1.bmp)"
downScroller.display = '';
menuChildren(2).all.tags("DIV").item(0).style.backgroundImage = "url(" + IMAGES + "ico_support_xp1.bmp)"
scrollArea.overflow = 'hidden';

var vrows = Math.floor((screenHeight - 8) / rowHeight) - 2
if (vrows <= 0)
{
remove_flyout()
return
}

scrollArea.height = vrows * rowHeight
menuStyle.posTop = (screenHeight - menuToShow.offsetHeight) / 2 + docTop - 2
menuChildren(1).scrollTop = 0
}
}
}
makeRectangularDropShadow(menuToShow, MENU_SHADOW_COLOR, 4)
menuToShow.focus()
global.fo_muLeft = menuToShow.offsetLeft
global.fo_muRight = global.fo_muLeft + menuToShow.offsetWidth
global.fo_muTop = menuToShow.offsetTop
global.fo_muBottom = global.fo_muTop + menuToShow.offsetHeight
hide_elements("SELECT")
hide_elements("OBJECT")
if (hideIFrames) hide_elements("IFRAME")
}
}

function element_top(el)
{
var et = 0
while (el)
{
et += el.offsetTop
el = el.offsetParent
}
return et
}

function makeRectangularDropShadow(el, color, size)
{
var i;
for (i=size; i>0; i--)
{
var rect = document.createElement('div');
var rs = rect.style
rs.position = 'absolute';
rs.left = (el.style.posLeft + i) + 'px';
rs.top = (el.style.posTop + i) + 'px';
rs.width = el.offsetWidth + 'px';
rs.height = el.offsetHeight + 'px';
rs.zIndex = el.style.zIndex - i;
rs.backgroundColor = color;
var opacity = 1 - i / (i + 1);
rs.filter = 'alpha(opacity=' + (100 * opacity) + ')';
el.insertAdjacentElement('afterEnd', rect);
global.fo_shadows[global.fo_shadows.length] = rect;
}
}

function submenu_onmouseout()
{
var gc = global.fo_currentMenu
if (!gc) return
var event = window.event
if (!gc.contains(event.toElement))
{
if (event.x < MENU_WIDTH)
return
global.fo_killTimer = window.setTimeout(this.id + ".kill_flyout()", KILL_DELAY, "JScript")
event.cancelBubble = true
}
}

function submenu_onmouseover()
{
if (kt = global.fo_killTimer) //not a == typo
{
window.clearTimeout(kt)
global.fo_killTimer = null
}
}

function kill_flyout()
{
global.fo_killTimer = null
remove_flyout()
global.fo_currentMenu = ''
}

function body_onmousemove()
{
if (!global.fo_currentMenu)
return
if (global.fo_killTimer)
return
if (global.fo_currentMenu.contains(window.event.srcElement))
return
if (window.event.x < MENU_WIDTH)
return
kill_flyout()
}

function create_sublink(html, className)
{
var sublink = document.createElement("table")
sublink.cellPadding = 0
sublink.cellSpacing = 0
sublink.style.margin = "0px 2px"
sublink.widthAdjust = 0
var td = sublink.insertRow().insertCell()
if (!className) className = "flyoutSubLink"
td.className = className
td.submenu = "1"
td.innerHTML = html
return sublink
}

function create_separator()
{
var sep = document.createElement("table")
sep.cellPadding = 0
sep.cellSpacing = 0
sep.style.margin = "2px 0px"
sep.widthAdjust = 4
var td = sep.insertRow().insertCell()
td.width = "100%"
td.height = "1"
td.bgColor = MENU_BORDER_COLOR
return sep
}

function hide_elements(tagName)
{
windowed_element_visibility(tagName, -1)
}

function show_elements(tagName)
{
windowed_element_visibility(tagName, +1)
}

function windowed_element_visibility(tagName, change)
{
var els = global.all.tags(tagName)
var i
for (i=0; i < els.length; i++)
{
var el = els.item(i)
if (elements_overlap(el))
{
if (el.visLevel)
el.visLevel += change
else
el.visLevel = change
if (el.visLevel == -1)
{
el.visibilitySave = el.style.visibility
el.style.visibility = "hidden"
}
else if (el.visLevel == 0)
el.style.visibility = el.visibilitySave
}
}
}

function elements_overlap(el)
{
var left = 0
var top = 0
var width = el.offsetWidth
var height = el.offsetHeight
while (el)
{
left += el.offsetLeft
top += el.offsetTop
el = el.offsetParent
}
return ((left < global.fo_muRight) && (left + width > global.fo_muLeft) && (top < global.fo_muBottom) && (top + height > global.fo_muTop))
}

</SCRIPT>

</PUBLIC:COMPONENT>

====================================================

menu.xml

<?xml version="1.0"?>

<!--TOOLBAR_EXEMPT-->

<menu>

<menugroup>

<submenu handle="pt" href="/products/" label="Products &amp; Technologies">

<heading label="DXTransform" />

<item href="barn.html" label="Barn"/>

<item href="blinds.html" label="Blinds"/>

<item href="fade.html" label="Fade"/>

<item href="zigzag.html" label="Zigzag"/>

<item href="inset.html" label="Inset"/>

<item href="pixelate.html" label="Pixelate"/>

<item href="radialwipe.html" label="Radial Wipe"/>

<item href="slide.html" label="Slide I"/>

<item href="slide2.html" label="Slide II"/>

<item href="slide3.html" label="Slide III"/>

<item href="slide4.html" label="Slide IV"/>

<item href="slide5.html" label="Slide V"/>

<item href="slide6.html" label="Slide VII"/>

<item href="spiral.html" label="Spiral"/>

<item href="wheel.html" label="Wheel"/>

<item href="stretch1.html" label="Stretch I"/>

<item href="stretch2.html" label="Stretch II"/>

<item href="stretch3.html" label="Stretch III"/>

<item href="wipe1.html" label="Wipe I"/>

<item href="wipe2.html" label="Wipe II"/>

<item href="wipe3.html" label="Wipe III"/>

<item href="burnfilm.html" label="Burn Film"/>

<item href="centercurls.html" label="Center Curls"/>

<item href="colorfade.html" label="Color Fade"/>

<item href="curtain.html" label="Curtains"/>

<item href="flowmotion.html" label="Flow Motion"/>

<item href="glassblock.html" label="Glass Block"/>

<item href="grid.html" label="Grid"/>

<item href="jaws.html" label="Jaws"/>

<item href="lens.html" label="Lens"/>

<item href="liquid.html" label="Liquid"/>

<item href="lightwipe.html" label="Light Wipe"/>

<item href="pagecurl.html" label="Page Curl"/>

<item href="peelabcd.html" label="Peel ABCD"/>

<item href="ripple.html" label="Ripple"/>

<item href="threshold.html" label="Threshold"/>

<item href="twister" label="Twister"/>

<item href="vacuum.html" label="Vacuum"/>

<item href="water.html" label="Water"/>

<item href="wheel.html" label="Wheel"/>

<item href="wormhole.html" label="Wormhole"/>

<item href="white.html" label="White"/>

<item href="rolldown.html" label="Roll Down"/>

<item href="multiple.html" label="Multiple Transform"/>

<item href="singlefade.html" label="Single Fade"/>

</submenu>

<submenu href="/library/" label="MSDN Library"/>

<submenu href="/code/" label="Code Center"/>

<submenu handle="dl" href="/downloads/" label="Downloads">

<item href="/downloads/" label="Developer Downloads"/>

<item href="/subscriptions/resources/subdwnld.asp" label="Subscriber Downloads"/>

<item href="http://www.microsoft.com/downloads" label="Microsoft Download Center"/>

<item href="/isapi/gosupport.asp?target=/support/servicepacks/default.asp?sd=msdn&amp;fr=0" label="Service Packs"/>

<item href="http://www.research.microsoft.com/downloads/" label="Microsoft Research Downloads"/>

</submenu>


<submenu href="/howto/" handle="ht" label="How-To Articles">

<item href="/howto/" label="Search How-Tos"/>

<item href="/howto/howto_index.asp" label="How-To Index"/>

</submenu>

<submenu handle="mg" href="/msdnmag/" label="MSDN Magazine">

<item href="/msdnmag/default.aspx" label="Kurikulum"/>

<item href="/msdnmag/backissues02.aspx" label="Kesiswaan"/>

<item href="/msdnmag/backissues01.aspx" label="Kepegawaian "/>

<item href="/msdnmag/backissues00.aspx" label="Sarana "/>

<item href="/msdnmag/netindex.asp" label="Komite Sekolah"/>


</submenu>


<submenu handle="col" href="/columns/" label="Columns &amp; Shows">

<heading label="Voices Columns" />

<item href="/columns/vbnet.asp" label="Adventures in Visual Basic .NET"/>

<item href="/columns/askgui.asp" label="Ask Dr. GUI"/>

<item href="/columns/service.asp" label="At Your Service"/>

<item href="/columns/secure.asp" label="Code Secure"/>

<item href="/columns/deepc.asp" label="Deep C++"/>

<item href="/columns/data.asp" label="Diving Into Data Access"/>

<item href="/columns/drguinet.asp" label="Dr. GUI .NET"/>

<item href="/columns/directx.asp" label="Driving DirectX"/>

<item href="/columns/embedded.asp" label="Get Embedded"/>

<item href="/columns/xml.asp" label="Extreme XML"/>

<item href="/columns/designers.asp" label=".NET Designers"/>

<item href="/columns/aspnet.asp" label="Nothin' but ASP.NET "/>

<item href="/columns/office.asp" label="Office Talk "/>

<item href="/columns/scripting.asp" label="Scripting Clinic "/>

<item href="/columns/two4road.asp" label="Two for the Road"/>

<item href="/columns/webmen.asp" label="Web Team Talking "/>

<item href="/columns/winforms.asp" label="Wonders of Windows Forms"/>

<item href="/columns/csharp.asp" label="Working with C# "/>

<heading label="MSDN Magazine Columns &amp;nbsp;" />

<item href="/msdnmag/columns/c.asp" label="C++ Q &amp; A"/>

<item href="/msdnmag/columns/web.asp" label="Web Q &amp; A"/>

<item href="/msdnmag/columns/basics.asp" label="Advanced Basics"/>

<item href="/msdnmag/columns/net.asp" label=".NET"/>

<item href="/msdnmag/columns/data.asp" label="Data Points"/>

<item href="/msdnmag/columns/xml.asp" label="XML Files"/>


<heading label="Shows" />

<item href="/theshow/default.asp" label="The .NET Show"/>

<item href="/vbtv/default.asp" label="VBTV"/>

</submenu>

    <submenu href="/support/" label="Support" />


<submenu handle="devcom" href="/community/" label="Developer Community">

            <item href="/community/" label="MSDN Community Home Page"/>

<item href="/newsgroups/" label="Newsgroups"/>

<item href="/chats/" label="Technical Chats"/>

<item href="/usergroups/" label="User Groups"/>

<item href="/community/related/" label="Related Communities"/>

<item href="/vkiosk/" label="Volunteer Kiosk"/>


</submenu>

<submenu handle="train" href="intel.html" label="Intel">

<item href="fire.html" label="Fire"/>

<item href="cloud.html" label="Cloud"/>

<item href="star.html" label="Star"/>

<item href="Water" label="Water"/>

<item href="curtainswde.html" label="Curtains"/>

<item href="smoke.html" label="Smoke"/>

</submenu>

<submenu handle="subscr" href="/subscriptions/" label="Subscriptions">

<item href="/subscriptions/" label="HTML"/>

<item href="/subscriptions/prodinfo/overview.asp

" label="JScript"/>

<item href=" /subscriptions/prodinfo/subscribe.asp

" label="XML"/>

<item href=" /subscriptions/resources/highlights.asp

" label="Style Sheet"/>

</submenu>

<submenu href="/partners/" label="Partners &amp; Certification"/>


</menugroup>

<menugroup>

<submenu href="/isapi/gomscom.asp?target=/technet/" label="IT Professionals"/>

<submenu href="/architecture/" label="Architects"/>

</menugroup>

</menu>


Tidak ada komentar: