Using Dreamweaver I wont to create a XML Menu

Hi sa_designer,

There are a number of approaches to this problem, but none are built into Dreamweaver.  You could search the Exchange for a menu creator that loads the menu data from an XML document or go to a completely third party solution:

http://www.google.com/search?q=drop+down+menu+XML

You probably will have something that is CSS or javascript based that uses XML documents to populate the menus when all is said and done.

Hi there,

Ok I'm doing the job. You were right the XML menu is CSS & javascript based. The CSS sames to be in control of the text links and the java is control of the drop down menu.

Need help amending the menu:

How do I get the menu to roll over and form a tab and the drop down menu appears but when you move the mouse down the menu the roll over at the top is still present. At the moment it rolls over but then disappears when the mouse moves down the drop down.

Thanks

The answer depends on the method you are using to create the menus.  If you are using pure CSS, post the question and source code in the CSS area.  If javascript, post the question and source code there.

You could post it here, but I'm not great with javascript and since this question has been open a few days other experts are not actively looking at it.

post code!

Javascript code

var sgXMLfile = new String()
var topnavxmlDoc = new ActiveXObject("Microsoft.XMLDOM")
topnavxmlDoc.async="false"

// variables for xml tags
var topic = topic
var subtopic = subtopic

/////////////////////////////////////
// LOAD UP MENU FUNCTION FILE THAT CONTAINS DISPLAY DIV FUNCTIONS ETC
//document.write('<SCRIPT language=JavaScript1.2 src="/emarketing/webtools/homepage/js/menu_functions.js" type=text/javascript></SCRIPT>')
//////////////////////////////////////

function TopNavMenu(sXMLfile){

//TopNavXMLfile = sXMLfile
topnavxmlDoc.load("/sarah/homepage/menu.xml")

document.write('<table width="610" border="0" cellspacing="0" cellpadding="10" bgcolor="#5F9BCF" align="left"><tr>')

for (y = 0; y < topnavxmlDoc.getElementsByTagName("menuitem").length; y++)
{
// IF NOT SUBMENU ITEM - PRINT MENUITEM NAME AND ADD LINK
if (topnavxmlDoc.getElementsByTagName("menuitem").item(y).getElementsByTagName("subtopic").length == 0)
{
document.write(topnavxmlDoc.getElementsByTagName("menuitem").item(y).getElementsByTagName("topic").item(0).text)
document.write('</td>')
}
else
{
document.write('<td width="30" class="topNav">')
document.write('<div id="testdiv" onmouseover="displaytopmenu(this,\'topnav'+y+'\');tn_cleartime()" onmouseout="tn_timeout()">&nbsp;<a href="#">')
document.write(topnavxmlDoc.getElementsByTagName("menuitem").item(y).getElementsByTagName("topic").item(0).text)
document.write('</a></div></td>')
}
// END LOOP ROUND XML NODES
}
document.write('</tr></table>')

/////////////////////////////////////////////////////////////////////////
// DIV CREATION
/////////////////////////////////////////////////////////////////////////
var topnavdisttemp;
topnavdisttemp = 180;
for (x = 0; x < topnavxmlDoc.getElementsByTagName("menuitem").length; x++)
{
if (topnavxmlDoc.getElementsByTagName("menuitem").item(x).getElementsByTagName("subtopic").length > 0)
{

document.write('<style> .topnav'+x+'{POSITION: absolute; LEFT:'+topnavdisttemp+'px; TOP: 98px; } </style>')

document.write('<DIV name="topnav'+x+'" ID="topnav'+x+'" STYLE="visibility:hidden; z-index:1" class="topnav'+x+'" onmouseover="tn_cleartime()" onmouseout="tn_timeout()">')

/////////////////////////////////////////////////////////////////////////
//FLYOUT BEGIN MAIN TABLE
/////////////////////////////////////////////////////////////////////////
document.write('<table border="0" cellpadding="0" cellspacing="0" width="75"><tr><td bgcolor="#5F9BCF" height="1" colspan="3"><img src="/emarketing/webtools/homepage/images/blank.gif" height="1"></td></tr>')
document.write('<tr><td width="1" bgcolor="#666666"><img src="/emarketing/webtools/homepage/images/blank.gif" width="1"></td><td width="100%">')
/////////////////////////////////////////////////////////////////////////
document.write('<table cellpadding="0" cellspacing="0" border="0" width="100%" bgcolor="#666666">')
for (xx = 0; xx <topnavxmlDoc.getElementsByTagName("menuitem").item(x).getElementsByTagName("subtopic").length;xx++) {
document.write('<tr onmouseover="this.style.backgroundColor=\'#EFA333\'" onMouseout="this.style.backgroundColor=\'#ffffff\';"><td height="18"><a href="')
document.write(topnavxmlDoc.getElementsByTagName("menuitem").item(x).getElementsByTagName("link").item(xx).text+'" class="topnav_submenulink" onmouseover="tn_cleartime();">');
document.write(topnavxmlDoc.getElementsByTagName("menuitem").item(x).getElementsByTagName("subtopic").item(xx).text+'</a></td></tr>');
document.write('<tr><td ="#666666" height="1"><img src="/emarketing/webtools/homepage/images/blank.gif" height="1" width="1"></td></tr>')
}
document.write('</table>')
/////////////////////////////////////////////////////////////////////////////
//FLYOUT END MAIN TABLE
/////////////////////////////////////////////////////////////////////////////
document.write('</td><td width="1" bgcolor="#666666"><img src="/emarketing/webtools/homepage/images/blank.gif" width="1"></td></tr>')
document.write('</table>')
/////////////////////////////////////////////////////////////////////////////
document.write('</DIV>')
}
}
////////////////////////////////////////////////////////////////////////////////
// END FUNCTION
}

The CSS code

/* TOPNAV MENU ITEMS */
.topNav{
      font-family:  Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
      color: #ffffff;
      Text-decoration: none;
      text-transform: uppercase;
}
.topNav A:link {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
      COLOR: #ffffff;
      TEXT-DECORATION: none;
      text-transform: uppercase;
}
.topNav A:visited {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
      COLOR: #ffffff;
      TEXT-DECORATION: none;
      text-transform: uppercase;
}
.topNav A:hover {
      font-family: Arial, Helvetica, sans-serif;
      font-size: 10px;
      font-weight: bold;
      COLOR: #333333;
      TEXT-DECORATION: none;
      text-transform: uppercase;
}
/* ------------------------------------ */

/* TOPNAV DROP DOWNS */

.topnav_submenulink
{
      BORDER-BOTTOM: #333333 1px;
      BORDER-LEFT: #333333 1px;
      BORDER-RIGHT: #333333 1px;
      BORDER-TOP: #333333 1px;
      COLOR: #333333;
      FONT-FAMILY: Arial, Helvetica, "sans serif";
      FONT-SIZE: 10px;
      FONT-WEIGHT: bold;
      PADDING-LEFT: 5px;
      TEXT-DECORATION: none;
      WIDTH: 140px;
      text-transform: capitalize;
}
.topnav_submenulink A:link {
      COLOR: #ffffff;
      TEXT-DECORATION: none;
}
.topnav_submenulink A:visited {
      COLOR: #ffffff;
      TEXT-DECORATION: none;
}
.topnav_submenulink:hover
{
    COLOR: #ffffff;
    TEXT-DECORATION: none;
      /*background-image: url("/emarketing/webtools/homepage/images/right_arrow.gif");
      background-repeat: no-repeat;
      background-position: 0% 25%;
      PADDING-LEFT: 5px;*/

}

/* ------------------------------------ */

<SCRIPT language=JavaScript1.2 src="/emarketing/webtools/homepage/js/menu_functions.js


="/emarketing/webtools/homepage/js/menu_functions.js <<<< These have to be configured to represent location on your site.

please post the xml code.

menu_functions.js code:

var lasttopmenu = ""
var lastmenu = ""

function displaytopmenu(el,thetopmenu){
            
      if (lasttopmenu != "")
      {
            hideLayer(lasttopmenu)
      }
      
showtopLayer(el,thetopmenu);
lasttopmenu=thetopmenu;

}

function showtopLayer(el,thetopLayer)
{
      if(document.getElementById)
      {
            var thismenu = document.getElementById(thetopLayer);
            thismenu.style.visibility='visible';
            thismenu.style.pixelLeft = getPos(el,"Left");// + el.offsetWidth + 17;
            thismenu.style.pixelTop = getPos(el,"Top") + 21;
      }
      else if(document.all)
      {
            document.all[thetopLayer].style.visibility='visible';
      }
      else if(document.layers)
      {
            document.layers[thetopLayer].visibility='show';
      }
}

function getPos(el,sProp) {
      var iPos = 0
      while (el!=null) {
            iPos+=el["offset" + sProp]
            el = el.offsetParent
      }
      return iPos
}

function displaymenu(themenu){

      if (lastmenu != "")
      {
            hideLayer(lastmenu)
      }
      
showLayer(themenu);
lastmenu=themenu;

}

function showLayer(theLayer)
{
      if(document.getElementById)
      {
            document.getElementById(theLayer).style.visibility='visible';
      }
      else if(document.all)
      {
            document.all[theLayer].style.visibility='visible';
      }
      else if(document.layers)
      {
            document.layers[theLayer].visibility='show';
      }
}

function hideLayer(theLayer)
{
      if(document.getElementById)
      {
            document.getElementById(theLayer).style.visibility='hidden';
      }
      else if(document.all)
      {
            document.all[theLayer].style.visibility='hidden';
      }
      else if(document.layers)
      {
            document.layers[theLayer].visibility='hide';
      }
}

function colour(theobject,thecolour){
      theobject.style.backgroundColor=thecolour
}

var hideme;
var quickhideme;
var tn_hideme;
var tn_quickhideme;

function hideit()
{
      hideLayer(lastmenu);
}

function tn_hideit()
{
      hideLayer(lasttopmenu);
}

function cleartime()
{
      clearTimeout(hideme);
      //timeout();
}

function tn_cleartime()
{
      clearTimeout(tn_hideme);
      //timeout();
}

function timeout()
{
      hideme=setTimeout('hideit();',1000);
}

function tn_timeout()
{
      tn_hideme=setTimeout('tn_hideit();',1000);
}

function timeoutquick()
{
      if (lastmenu != "") {
            quickhideme=setTimeout('hideit();',10);
      }
}

function tn_timeoutquick()
{
      if (lasttopmenu != "") {
            tn_quickhideme=setTimeout('tn_hideit();',10);
      }
}

The website is an intranet on one of our servers.