Problemer med js menu

Der må ikke gives point på eksperten for løsninger ikke alle kan se. Dvs ingen point for løsninger over ICQ eller mail.

Er det ikke nemmere at smide koden op eller give et link?

Jeg er helt enig med nikolajdu.

/Thor

Hmmmmmm... god start ;-)
Problemet er at der er rimelig meget kode og alt data til menu\'en ligger i en accessdatabase.... Den er ikke så nem at poste her...

Anyway: link: http://212.130.64.83

Problemet er at hvis man har fået en undermenu til at rulle ned - vil undermenuerne aldrig rulle op igen selvom man fjerner musen

mvh
Lars

Kode til menu\'en:

Coolmenu.js
function onMenuMouseOver(oThis, oSubItem, idx, itm)
{
  window.event.cancelBubble = true;
  if (oThis == null) return;

  var doc = document;
  var oMenu = doc.Menues[idx];
 
  if (oMenu.ActiveMenuItem != null)
  {
    mnuHide(oMenu.ActiveMenuItem);
    oMenu.ActiveMenuItem = null;

    oMenu.LastMenuItem.background = \'\';
    oMenu.LastMenuItem.style.color = oMenu.Color;
    oMenu.LastMenuItem.style.cursor = \'\';
    oMenu.LastMenuItem = null;
  }
 
  oThis.background = oMenu.imgSelectedBackground.src;
  oThis.style.color = oMenu.SelectedColor;
  oThis.style.cursor = \'Hand\';

  if (oMenu.Items[itm].Class == \'mnuSubItem\') // We are entering a sub menu.
  {
    var o = findMenu(event.srcElement);
    var tbl = findObj(\'tbl\' + oSubItem.id);
    if (((o.style.posLeft + o.scrollWidth) - 2) + parseInt(tbl.width) >
document.body.scrollWidth)
    {
      if (((o.style.posLeft - o.scrollWidth) + 2) < 0)
        oSubItem.style.posLeft = (o.style.posLeft + o.scrollWidth) - 2;
      else
        oSubItem.style.posLeft = ((o.style.posLeft - o.scrollWidth) + 2);
    }
    else
      oSubItem.style.posLeft = (o.style.posLeft + o.scrollWidth - 2);
    oSubItem.style.posTop = (event.clientY - event.offsetY)-2;
    o.style.zIndex=2;
    mnuShow(oSubItem);
    oMenu.ActiveMenuItem = oSubItem;
    oMenu.LastMenuItem = oThis;
    oSubItem.Owner = oMenu
  }

}


function onMenuMouseOut(oThis, idx, itm)
{
  event.cancelBubble = true;
  if (oThis != null)
  {
    var doc = document;
    var oMenu = doc.Menues[idx];
    if (oMenu.ActiveMenuItem == null)
    {
      oThis.background = \'\';
      oThis.style.color = oMenu.Color;
      oThis.style.cursor = \'\';
    }
  }
  event.cancelBubble = true;
}

function onMenuMouseClick(oThis, idx, itm)
{
  event.cancelBubble = true;
  if (oThis != null)
  {
    var doc = document;
    var oItm = doc.Menues[idx].Items[itm];
    if (oItm.Target==\"\")
      document.location = oItm.URL;
    else
      window.open(oItm.URL, oItm.Target);
  }
}


function findMenu(srcElement)
{
  var oMenu = srcElement;
  while ((oMenu != null) && (oMenu.className != \"mnuPopup\"))
  {
    oMenu = oMenu.parentElement
  }
  return oMenu;
}
function BEGIN_MENU(aMenu, topSpc)
{
  document.writeln(\'<div id=\"\' + aMenu.id + \'\" class=\"mnuPopup\" align=\"left\" style=\"display: none; position: absolute; left:0; top:\' + topSpc + \'; z-index:0\" >\');
  document.write(\'<table id=\"tbl\' + aMenu.id + \'\" border=\"1\" cellpadding=\"0\" cellspacing=\"0\" width=\" \');
  document.write(aMenu.Width + \' style=\"border-style: outset; border-width: 0; cursor: Hand;\" \');
  document.write(\'bgcolor=\"\' + aMenu.BackgroundColor + \'\" \');
  document.write(\'bordercolor=\"#cccccc\" \');
  if (aMenu.imgBackground)
    document.writeln(\'background=\"\' + aMenu.imgBackground.src + \'\" >\');
  else
    document.writeln(\'background=/nav/navtom.jpg >\');
  document.writeln(\'<tr>\');
  document.writeln(\'<td>\');
}

function END_MENU()
{
  document.writeln(\'</td>\');
  document.writeln(\'</tr>\');
  document.writeln(\'</table>\');
  document.writeln(\'</div>\');
}

function MenuItem(aMenuItem, idx, itm)
{
  document.writeln(\'<!-- Menu Item Begin -->\');
  bgcolor=\"#cccccc\"
  document.write(\'<table border=\"0\" style=\"font-family: Arial Narrow; font-size: 10pt; color: #333366\" cellpadding=\"0\" cellspacing=\"0\" height=\"16\" width=\"100%\" class=\"mnuItem\"\');
  document.write(\'onmouseover=\"onMenuMouseOver(this,null,\' + idx + \',\' + itm + \');\" \');
  document.write(\'onmouseout=\"onMenuMouseOut(this,\' + idx + \',\' + itm + \');\" \');
  document.writeln(\'onclick=\"onMenuMouseClick(this,\' + idx + \',\' + itm + \');\" >\');
  document.writeln(\'<tr>\');
  if (aMenuItem.img)
    document.writeln(\'<td width=\"22\" align=\"center\" valign=\"middle\"><img border=\"0\" src=\"\' + aMenuItem.img.src + \'\" width=\"15\" height=\"15\"></td>\');
  else
    document.writeln(\'<td width=\"22\" align=\"center\" valign=\"middle\"><img border=\"0\" src=\"images/spacer.gif\" width=\"15\" height=\"15\"></td>\');
  document.writeln(\'<td color=\"\' + aMenuItem.parent.Color + \'\"><font color=#333366>\' + aMenuItem.Caption + \'</font></td>\');
  document.writeln(\'<td align=\"right\"></td>\');
  document.writeln(\'</tr>\');
  document.writeln(\'</table>\');
  document.writeln(\'<!-- Menu Item End -->\');
}

function SubMenuItem(aMenuItem, idx, itm)
{
  document.writeln(\'<!-- Sub Menu Item Begin -->\');
  document.write(\'<table border=\"0\" style=\"font-family: Arial Narrow; font-size: 10pt; color: #333366\" cellpadding=\"0\" cellspacing=\"0\" height=\"16\" width=\"100%\" class=\"mnuSubItem\"\');
  document.write(\'onmouseover=\"onMenuMouseOver(this,\' + aMenuItem.id + \',\' + idx + \',\' + itm + \');\" \');
  document.writeln(\'onmouseout=\"onMenuMouseOut(this,\' + idx + \',\' + itm + \');\" >\');
  document.writeln(\'<tr>\');
  if (aMenuItem.img)
    document.writeln(\'<td width=\"22\" align=\"center\" valign=\"middle\"><img border=\"0\" src=\"\' + aMenuItem.img.src + \'\" width=\"15\" height=\"15\"></td>\');
  else
    document.writeln(\'<td width=\"22\" align=\"center\" valign=\"middle\"><img border=\"0\" src=\"images/spacer.gif\" width=\"15\" height=\"15\"></td>\');
  document.writeln(\'<td color=\"\' + aMenuItem.parent.Color + \'\"><font color=#333366>\' + aMenuItem.Caption + \'</font></td>\');
  document.writeln(\'<td align=\"right\"><img border=\"0\" src=\"images/SubMenuPunkt.gif\" width=\"11\" height=\"16\"></td>\');
  document.writeln(\'</tr>\');
  document.writeln(\'</table>\');
  document.writeln(\'<!-- Sub Menu Item End -->\');
}

function MenuLine()
{
  document.writeln(\'  <!-- Space Begin -->\');
  document.writeln(\'  <table border=\"0\" cellpadding=\"0\" bgcolor=\"#000000\" height=\"1\" cellspacing=\"0\" width=\"100%\">\');
  document.writeln(\'    <tr>\');
  document.writeln(\'      <td><img border=\"0\" src=\"images/Non.bmp\" width=\"1\" height=\"1\"></td>\');
  document.writeln(\'    </tr>\');
  document.writeln(\'    <tr>\');
  document.writeln(\'      <td bgcolor=\"#cccccc\"><img border=\"0\" src=\"images/Non.bmp\" width=\"1\" height=\"1\"></td>\');
  document.writeln(\'    </tr>\');
  document.writeln(\'    <tr>\');
  document.writeln(\'      <td><img border=\"0\" src=\"images/Non.bmp\" width=\"1\" height=\"1\"></td>\');
  document.writeln(\'    </tr>\');
  document.writeln(\'  </table>\');
  document.writeln(\'  <!-- Space End -->\');
}

function LoadMenues( topSpc )
{
  var idx;
  var idx2;
  var Items;
 
  var sHTML = \'<script language=\"JavaScript\"> \';
  var doc = document;
  for(idx=0; idx<doc.Menues.length; idx++)
  {
    BEGIN_MENU(doc.Menues[idx], topSpc);
    Items = doc.Menues[idx].Items;
    for(idx2=0; idx2<Items.length; idx2++)
    {
      if (Items[idx2].Class == \"mnuItem\")
        MenuItem(Items[idx2], idx, idx2);
      else // \"mnuSubItem\"
        SubMenuItem(Items[idx2], idx, idx2);
      if (idx2 < Items.length-1)
        MenuLine();
    }
    END_MENU();
    sHTML = sHTML + \'document.Menues[\' + idx + \'].div = \' + doc.Menues[idx].id + \'; \';
  }
  sHTML = sHTML + \'</\' + \'script>\';
  document.writeln(sHTML);
}

----
Coolsetup.js
----

var m_Offset = 0;

function setOffset(offset)
{
  m_Offset = offset;
}

function getOffset()
{
  return m_Offset;
}

function AddToolbarItem(aNormal, aSelected, aPopupMenu, aToolTip, aTarget, aURL)
{
  if (!document.ToolbarItems)
    document.ToolbarItems = new Array();
   
  var idx = document.ToolbarItems.length;
 
  document.ToolbarItems[idx] = new Object();
  var tbi = document.ToolbarItems[idx];
  tbi.imgNormal = new Image;
  tbi.imgNormal.src = aNormal;
  tbi.imgSelected = new Image;
  tbi.imgSelected.src = aSelected;
  tbi.PopupMenu = aPopupMenu;
  tbi.Tooltip = aToolTip;
  tbi.Target = aTarget;
  tbi.URL = aURL;
}

function CreateMenu(id,aWidth,aNormal,aBgImage,aSelBgImage,aBgColor,aColor,aSelBgColor,aSelColor)
{
  if (!document.Menues)
    document.Menues = new Array();
   
  var idx = document.Menues.length;
 
  document.Menues[idx] = new Object();
  var mbi = document.Menues[idx];
 
  mbi.id = id;
  if (aNormal)
  {
    mbi.imgNormal = new Image;
    mbi.imgNormal.src = aNormal;
  }
  if (aBgImage)
  {
    mbi.imgBackground = new Image;
    mbi.imgBackground.src = aBgImage;
  }
  if (aSelBgImage)
  {
    mbi.imgSelectedBackground = new Image;
    mbi.imgSelectedBackground.src = aSelBgImage;
  }
  mbi.BackgroundColor = aBgColor;
  mbi.Color = aColor;
  mbi.SelectedColor = aSelColor;
  mbi.SelectedBgColor = aSelBgColor;
  mbi.Width = aWidth;
 
  return mbi;
}

function AddMenuItem(parent,aImage,aCaption,aTarget,aURL)
{
  if (parent)
  {
    if (!parent.Items)
      parent.Items = new Array();
   
    var idx = parent.Items.length;
 
    parent.Items[idx] = new Object();
    var mi = parent.Items[idx];
   
    mi.URL = aURL;
    mi.Class = \"mnuItem\";
    mi.parent = parent;
    mi.Target = aTarget;
    mi.Caption = aCaption;
    if (aImage != null)
    {
      mi.img = new Image;
      mi.img.src = aImage;
    }
  }
}

function AddSubMenuItem(id,parent,SubMenu,aImage,aCaption)
{
  if (parent)
  {
    if (!parent.Items)
      parent.Items = new Array();
   
    var idx = parent.Items.length;
 
    parent.Items[idx] = new Object();
    var mi = parent.Items[idx];
   
    mi.id = id;
    mi.menu = SubMenu;
    mi.Class = \"mnuSubItem\";
    mi.parent = parent;
    mi.Caption = aCaption;
    if (aImage != null)
    {
      mi.img = new Image;
      mi.img.src = aImage;
    }
    return mi;
  }
  return null;
}

function mnuHide(oMenu)
{
  var idx;
  for(idx=0; idx<document.Menues.length; idx++)
    if (document.Menues[idx].div == oMenu)
    {
      if (document.Menues[idx].ActiveMenuItem != null)
      {
        mnuHide(document.Menues[idx].ActiveMenuItem);
        document.Menues[idx].ActiveMenuItem = null;
        document.Menues[idx].LastMenuItem.background = \'\';
        document.Menues[idx].LastMenuItem.style.color = document.Menues[idx].Color;
        document.Menues[idx].LastMenuItem.style.cursor = \'\';
        document.Menues[idx].LastMenuItem = null;
      }
    }
  oMenu.style.zIndex = 1;
  oMenu.style.display = \'none\';
//  var o = findObj(oMenu.id);
//  if (o) o.document.parentWindow.OnHide();
}

function mnuShow(oMenu)
{
  oMenu.style.zIndex = 99999;
  oMenu.style.display = \'\';
 
//  var o = findObj(oMenu.id);
//  if (o) o.document.parentWindow.OnShow();
}

function findObj(obj, doc)
{
  var i;
  var rc;
 
  if (!doc)
    doc = document;
 
  if(!(rc = doc[obj]))
    rc = doc.all[obj];
   
  for (i=0; (!rc) && (i < doc.forms.length); i++)
    rc = doc.forms[i][obj];
 
  for (i=0; (!rc) && i < doc.frames.length; i++)
    rc = findObj(obj,doc.frames[i].document);
 
  return rc;
}


-----
Cooltoolbar.js
-----


var m_oActiveMenu = null;
var m_oLastItem = null;
var m_oLastItemSrc = null;


function CloseActiveMenu()
{
  if (m_oActiveMenu == null) return;
  mnuHide(m_oActiveMenu);
  m_oActiveMenu = null;
 
  if ((m_oLastItem != null) && (m_oLastItemSrc != null))
    m_oLastItem.src = m_oLastItemSrc.imgNormal.src;
  m_oLastItem = null;
  m_oLastItemSrc.src = null;
}

function ToolbarMouseOver(oThis,oItem,oTargetDiv)
{
  event.cancelBubble = true;
  oThis.src = oItem.imgSelected.src;
 
  if (oItem.PopupMenu != null)
    oThis.style.cursor = \'Hand\';
 
  if (m_oActiveMenu != null)
  {
    mnuHide(m_oActiveMenu);
    m_oActiveMenu = null;
   
    m_oLastItem.src = m_oLastItemSrc.imgNormal.src;
    m_oLastItem = null;
    m_oLastItemSrc.src = null;
  }
  if ((oTargetDiv != null))
  {
    // Navigate to bookmark (ie Top of page)
    oTargetDiv.document.location.hash = \'#bmtop\';
   
    // Calculate left start position for menu
//    oTargetDiv.style.posLeft = (event.clientX - event.offsetX) + getOffset();
    oTargetDiv.style.posLeft = (event.clientX - event.offsetX) + getOffset();
    mnuShow(oTargetDiv);
    m_oActiveMenu = oTargetDiv;
    m_oLastItem = oThis;
    m_oLastItemSrc = oItem;
  }
}


function ToolbarMouseOut(oThis,oItem)
{
  event.cancelBubble = true;
  if (m_oActiveMenu == null)
    oThis.src = oItem.imgNormal.src;

  oThis.style.cursor = \'\';
}




function BEGIN_BUTTONS()
{
  document.writeln(\'<table border=\"0\" style=\"COLOR: #ffffff; FONT-FAMILY: Arial Narrow; FONT-SIZE: 10pt\" cellpadding=\"0\" cellspacing=\"0\" bgcolor=\"#cccccc\">\');
  document.writeln(\' <tr>\');
}

function END_BUTTONS()
{
  document.writeln(\' </tr>\');
  document.writeln(\'</table>\');
}

function AddButton(tblItem,idx)
{
  document.writeln(\'<!-- Toolbar Menu Btn Begin -->\');
  document.writeln(\'<td class=\"mnuBtn\" noWrap align=\"middle\" valign=top background=\"\' + tblItem.imgNormal.src + \'\"> \');
  document.write(\'<img src=\"\' + tblItem.imgNormal.src + \'\" \');
  document.write(\'alt=\"\' + tblItem.Tooltip + \'\" \');
  document.write(\'onmouseover=\"ToolbarMouseOver(this,document.ToolbarItems[\' + idx + \'], \' + tblItem.PopupMenu + \');\" \');
  document.write(\'onmouseout=\"ToolbarMouseOut(this,document.ToolbarItems[\' + idx + \']);\" \');
  document.writeln(\'>\');
  document.writeln(\'</td>\');
  document.writeln(\'<!-- Toolbar Menu Btn End -->\');
}

function NEW_LINE()
{
  document.writeln(\'  </tr>\');
  document.writeln(\'  <tr>\');
}

function LoadToolbar()
{
  var idx;
 
  Initialize();

  document.writeln(\'<div>\');
  BEGIN_BUTTONS();
  for(idx=0; idx<document.ToolbarItems.length; idx++)
  {
    AddButton(document.ToolbarItems[idx],idx);
  }
  END_BUTTONS();
  document.writeln(\'</div>\');
}


-----
Menu.inc... sættes ind i toppen af asp filer
-----

<% Language=VBScript %>
<%
   
   
   

    Set DBConn = Server.CreateObject(\"ADODB.Connection\")
    DBConn.Open \"Driver={Microsoft Access Driver (*.mdb)}; DBQ=\"&(Server.MapPath(\"e.mdb\"))

    sql = \"SELECT * FROM overgrupper ORDER BY sort\"
    Set mHeads = DBConn.Execute(sql)

    strMenus = \"function Initialize()\" & vbcrlf
    strMenus = strMenus & \"{\" & vbcrlf
    strMenus = strMenus & \"  if (document.Initialized) return;\" & vbcrlf

    mHeadIndex = 0
    do while not ( mHeads.EOF or mHeads.BOF )
        strMenus = strMenus & \"  AddToolbarItem(\'\" & mHeads(\"pic\") & \"\',\'\" & mHeads(\"picm\") & \"\',\" & _
                              \"\'\" & mHeads(\"Overgruppetekst\") & \"\',\" & _
                              \"\'\',\'\',\'\');\" & vbcrlf


        strMenus = strMenus & \"  var mnu\" & mHeadIndex & \" = CreateMenu(\'\" & mHeads(\"Overgruppetekst\") & \"\',180,null,\'nav/navbg.gif\',\'nav/1x16.bmp\',\'Black\',\'White\',\'Green\',\'Yellow\');\" & vbcrlf

        sql = \"SELECT * FROM varegrupper WHERE OvergruppeNr = \" & mHeads(\"OvergruppeNr\") & \" ORDER BY sort\"
        Set mItems = DBConn.Execute(sql)
           
        do while not ( mItems.EOF or mItems.BOF )
            if session(\"sp\")=\"da\" then
            strMenus = strMenus & \"  AddMenuItem(mnu\" & mHeadIndex & \",null,\'\"& mItems(\"VaregruppeTekst\") &\"\',\'\" & mItems(\"Targetframe\")& \"\',\'\" & mItems(\"Link\") & \"\');\" & vbcrlf
            else
            strMenus = strMenus & \"  AddMenuItem(mnu\" & mHeadIndex & \",null,\'\"& mItems(\"group\") &\"\',\'\" & mItems(\"Targetframe\")& \"\',\'\" & mItems(\"Link\") & \"\');\" & vbcrlf
            End if
            mItems.MoveNext
        loop   
       
        mItems.Close
        set mItems = nothing
       
        mHeads.MoveNext
        mHeadIndex = mHeadIndex + 1
    loop

    mHeads.Close
    set mHeads = nothing

    DBConn.Close
    set DBConn = nothing

    strMenus = strMenus & \"  document.Initialized = true;\" & vbcrlf
    strMenus = strMenus & \"}\" & vbcrlf

    strMenus = strMenus & \"Initialize();\" & vbcrlf
%>
<html>
<head>
<title>main</title>
<script language=\"JavaScript\" src=\"CoolToolbar.js\"></script>
<script language=\"JavaScript\" src=\"CoolSetup.js\"></script>
<script language=\"JavaScript\" src=\"CoolMenu.js\"></script>
<script language=\"JavaScript\">
setOffset(0);

<%=strMenus%>
</script>

Et sidste P.S.: Når du giver et link til din side, behøves du netop ikke at poste koden også - det er jo dobbeltkonfekt og fylder blot ;o)

Hmm, er det WebFX du har hentet den fra ?

/Thor

Øhhhhh mig bekendt kan man da ikke se koden blot fordi jeg poster et link... med mindre du går i gang med at hacke.... eller der noget jeg er gået helt glip af ???

Et lille højreklik og \"vis kilde\" - Vi har jo ikke brug for din ASP.

Hehe..nåhh ja... (flov - røde ører - pinligt berørt)