Ergebnis 1 bis 13 von 13
  1. #1
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    Defektes (?) Menü

    Hallo Leute,

    ich habe in diesem Forum folgendes Menü gefunden, was ich sehr schön finde.
    Allerdings steht die Combobox im Vordergrund, und ich weiß nicht, warum.
    Hat da jemand eine Idee?

    Gruß Lydia.


    Code:
    <html>
    <head>
    <link href="style.css" rel=stylesheet>
    <title>Menubar</title>
    </head>
    
    <body>
    <table width=100% cellpadding=3 cellspacing=1 border=0>
          <tr>
            <td class=title2 width="80">Titel</td>
            <td class=body2 width=400>Menubar&nbsp;</td>
          </tr>
          <tr>
            <td class=body2 colspan="2"><style type="text/css">
    
    #menuBar {
      background-color: #c0c0c0;
      border: 2px solid;
      border-color: #f0f0f0 #808080 #808080 #f0f0f0;
      color: #000000;
      font-size: 1pt;
      padding: 4px 2px 4px 2px;
      text-align: left;
      width: 80%;
    }
    
    a.menuButton, a.menuButtonActive {
      background-color: transparent;
      border: 1px solid #c0c0c0;
      color: #000000;
      cursor: default;
      font-family: "MS Sans Serif", Arial, Tahoma, sans-serif;
      font-size: 8pt;
      font-style: normal;
      font-weight: normal;
      margin: 1px;
      padding: 2px 6px 2px 6px;
      position: relative;
      left: 0px;
      top: 0px;
      text-decoration: none;
    }
    
    a.menuButton:hover {
      background-color: transparent;
      border-color: #f0f0f0 #808080 #808080 #f0f0f0;
      color: #000000;
    }
    
    a.menuButtonActive, a.menuButtonActive:hover {
      background-color: #a0a0a0;
      border-color: #808080 #f0f0f0 #f0f0f0 #808080;
      color: #ffffff;
      left: 1px;
      top: 1px;
    }
    
    .menu {
      background-color: #c0c0c0;
      border: 2px solid;
      border-color: #f0f0f0 #808080 #808080 #f0f0f0;
      padding: 0px;
      position: absolute;
      text-align: left;
      visibility: hidden;
    }
    
    a.menuItem {
      background-color: transparent;
      color: #000000;
      cursor: default;
      display: block;
      font-family: "MS Sans Serif", Arial, Tahoma,sans-serif;
      font-size: 8pt;
      font-style: normal;
      font-weight: normal;
      margin: 0px;
      padding: 2px;
      padding-left: 12px;
      padding-right: 16px;
      text-decoration: none;
      white-space: nowrap;
    }
    
    a.menuItem:hover {
      background-color: #000080;
      color: #ffffff;
    }
    
    .menuItemSep {
      border-bottom: 1px solid #f0f0f0;
      border-top: 1px solid #808080;
      margin: 3px 4px 3px 4px;
    }
    
    </style>
    <script type="text/javascript">
    <!-- ---------------------------------------------------- -->
    <!-- Menu Bar Demo                                        -->
    <!--                                                      -->
    <!-- Copyright 2000 by Mike Hall                          -->
    <!-- Please see http://www.brainjar.com for terms of use. -->
    <!-- ---------------------------------------------------- -->
    // Determine browser and version.
    
    function Browser() {
    
      var ua, s, i;
    
      this.isIE    = false;  // Internet Explorer
      this.isNS    = false;  // Netscape
      this.version = null;
    
      ua = navigator.userAgent;
    
      s = "MSIE";
      if ((i = ua.indexOf(s)) >= 0) {
        this.isIE = true;
        this.version = parseFloat(ua.substr(i + s.length));
        return;
      }
    
      s = "Netscape6/";
      if ((i = ua.indexOf(s)) >= 0) {
        this.isNS = true;
        this.version = parseFloat(ua.substr(i + s.length));
        return;
      }
    
      // Treat any other "Gecko" browser as NS 6.1.
    
      s = "Gecko";
      if ((i = ua.indexOf(s)) >= 0) {
        this.isNS = true;
        this.version = 6.1;
        return;
      }
    }
    
    var browser = new Browser();
    
    // Global variable for tracking the currently active button.
    
    var activeButton = null;
    
    // Capture mouse clicks on the page so any active button can be
    // deactivated.
    
    if (browser.isIE)
      document.onmousedown = pageMousedown;
    if (browser.isNS)
      document.addEventListener("mousedown", pageMousedown, true);
    
    function pageMousedown(event) {
    
      var el;
    
      // If there is no active menu, exit.
    
      if (!activeButton)
        return;
    
      // Find the element that was clicked on.
    
      if (browser.isIE)
        el = window.event.srcElement;
      if (browser.isNS)
        el = (event.target.className ? event.target : event.target.parentNode);
    
      // If the active button was clicked on, exit.
    
      if (el == activeButton)
        return;
    
      // If the element clicked on was not a menu button or item, close the
      // active menu.
    
      if (el.className != "menuButton"  && el.className != "menuItem" &&
          el.className != "menuItemSep" && el.className != "menu")
        resetButton(activeButton);
    }
    
    function buttonClick(button, menuName) {
    
      // Blur focus from the link to remove that annoying outline.
    
      button.blur();
    
      // Associate the named menu to this button if not already done.
    
      if (!button.menu)
        button.menu = document.getElementById(menuName);
    
      // Reset the currently active button, if any.
    
      if (activeButton && activeButton != button)
        resetButton(activeButton);
    
      // Toggle the button's state.
    
      if (button.isDepressed)
        resetButton(button);
      else
        depressButton(button);
    
      return false;
    }
    
    function buttonMouseover(button, menuName) {
    
      // If any other button menu is active, deactivate it and activate this one.
      // Note: if this button has no menu, leave the active menu alone.
    
      if (activeButton && activeButton != button) {
        resetButton(activeButton);
        if (menuName)
          buttonClick(button, menuName);
      }
    }
    
    function depressButton(button) {
    
      var w, dw, x, y;
    
      // Change the button's style class to make it look like it's depressed.
    
      button.className = "menuButtonActive";
    
      // For IE, set an explicit width on the first menu item. This will
      // cause link hovers to work on all the menu's items even when the
      // cursor is not over the link's text.
    
      if (browser.isIE && !button.menu.firstChild.style.width) {
        w = button.menu.firstChild.offsetWidth;
        button.menu.firstChild.style.width = w + "px";
        dw = button.menu.firstChild.offsetWidth - w;
        w -= dw;
        button.menu.firstChild.style.width = w + "px";
      }
    
      // Position the associated drop down menu under the button and
      // show it. Note that the position must be adjusted according to
      // browser, styling and positioning.
    
      x = getPageOffsetLeft(button);
      y = getPageOffsetTop(button) + button.offsetHeight;
      if (browser.isIE) {
        x += 2;
        y += 2;
      }
      if (browser.isNS && browser.version < 6.1)
        y--;
    
      // Position and show the menu.
    
      button.menu.style.left = x + "px";
      button.menu.style.top  = y + "px";
      button.menu.style.visibility = "visible";
    
      // Set button state and let the world know which button is
      // active.
    
      button.isDepressed = true;
      activeButton = button;
    }
    
    function resetButton(button) {
    
      // Restore the button's style class.
    
      button.className = "menuButton";
    
      // Hide the button's menu.
    
      if (button.menu)
        button.menu.style.visibility = "hidden";
    
      // Set button state and clear active menu global.
    
      button.isDepressed = false;
      activeButton = null;
    }
    
    function getPageOffsetLeft(el) {
    
      // Return the true x coordinate of an element relative to the page.
    
      return el.offsetLeft + (el.offsetParent ? getPageOffsetLeft(el.offsetParent) : 0);
    }
    
    function getPageOffsetTop(el) {
    
      // Return the true y coordinate of an element relative to the page.
    
      return el.offsetTop + (el.offsetParent ? getPageOffsetTop(el.offsetParent) : 0);
    }
    
    </script>
    
    
    <!-- Tags for the menu bar. -->
    
    <div id="menuBar"
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'fileMenu');"
        onmouseover="buttonMouseover(this, 'fileMenu');"
    >File</a
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'editMenu');"
        onmouseover="buttonMouseover(this, 'editMenu');"
    >Edit</a
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'viewMenu');"
        onmouseover="buttonMouseover(this, 'viewMenu');"
    >View</a
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'toolsMenu');"
        onmouseover="buttonMouseover(this, 'toolsMenu');"
    >Tools</a
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'optionsMenu');"
        onmouseover="buttonMouseover(this, 'optionsMenu');"
    >Options</a
    ><a class="menuButton"
        href=""
        onclick="return buttonClick(this, 'helpMenu');"
        onmouseover="buttonMouseover(this, 'helpMenu');"
    >Help</a
    ></div>
    
    <!-- Tags for the drop down menus. -->
    
    <div id="fileMenu" class="menu">
    <a class="menuItem" href="blank.html">File Menu Item 1</a>
    <a class="menuItem" href="blank.html">File Menu Item 2</a>
    <a class="menuItem" href="blank.html">File Menu Item 3</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">File Menu Item 4</a>
    <a class="menuItem" href="blank.html">File Menu Item 5</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">File Menu Item 6</a>
    </div>
    
    <div id="editMenu" class="menu">
    <a class="menuItem" href="blank.html">Edit Menu Item 1</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Edit Menu Item 2</a>
    <a class="menuItem" href="blank.html">Edit Menu Item 3</a>
    <a class="menuItem" href="blank.html">Edit Menu Item 4</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html"
       target="_blank"  onclick="resetButton(activeButton);return true;">Edit Menu Item 5</a>
    </div>
    
    <div id="viewMenu" class="menu">
    <a class="menuItem" href="blank.html">View Menu Item 1</a>
    <a class="menuItem" href="blank.html">View Menu Item 2</a>
    <a class="menuItem" href="blank.html">View Menu Item 3</a>
    </div>
    
    <div id="toolsMenu" class="menu">
    <a class="menuItem" href="blank.html">Tools Menu Item 1</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 2</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 3</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Tools Menu Item 4</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 5</a>
    </div>
    
    <div id="optionsMenu" class="menu">
    <a class="menuItem" href="blank.html">Options Menu Item 1</a>
    <a class="menuItem" href="blank.html">Options Menu Item 2</a>
    <a class="menuItem" href="blank.html">Options Menu Item 3</a>
    </div>
    
    <div id="helpMenu" class="menu">
    <a class="menuItem" href="blank.html">Help Menu Item 1</a>
    <a class="menuItem" href="blank.html">Help Menu Item 2</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Help Menu Item 3</a>
    </div>
    &nbsp;</td>
          </tr>
     <tr><td><select name="liste"><option value'lydia'>lydia</option>
     </td></tr>
    </table>
    </body>
    </html>

  2. #2
    pit-r Guest

    AW: Defektes (?) Menü

    Moin!

    Während die meisten Browser inzwischen damit korrekt umgehen (wenn entsprechende z-indizes gesetzt sind), sind selects in IE gegenüber HTML-Containern immer im Vordergrund. Den Effekt kannst Du vermeiden, indem Du das select beim Öffnen des Menüs unsichtbar machst oder aber einen Iframe (das ist in IE das einzige Element, das ein select überdecken kann) drüber legst. Den wiederum mußt Du unter Dein Menü packen.

    Ahoi - Pit

  3. #3
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Schnieff, Pit, das sind für mich alles "böhmische" Dörfer.
    Wie und wo setze ich denn das IFrame ein?

    Wäre für ein Beispiel dankbar.

    Gruß
    Lydia.

    Zitat Zitat von pit-r
    Moin!

    Während die meisten Browser inzwischen damit korrekt umgehen (wenn entsprechende z-indizes gesetzt sind), sind selects in IE gegenüber HTML-Containern immer im Vordergrund. Den Effekt kannst Du vermeiden, indem Du das select beim Öffnen des Menüs unsichtbar machst oder aber einen Iframe (das ist in IE das einzige Element, das ein select überdecken kann) drüber legst. Den wiederum mußt Du unter Dein Menü packen.

    Ahoi - Pit

  4. #4
    pit-r Guest

    AW: Defektes (?) Menü

    Hi!

    Wenn Du magst bau ich Dir das ins Menü-Script ein, dauert dann aber etwas...

    Ahoi - Pit

  5. #5
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Ich mag :-) und koch derweil einen Kaffee für Dich und leg Kekse raus ...

    Aber weil ich lern und willig bin, hihihi, sorry, gnigger, würde ich es ja auch gerne lernen, wenn es nicht allzu kompliziert ist ...
    Lieben Gruß
    Lydia.

  6. #6
    pit-r Guest

    AW: Defektes (?) Menü

    Hi!

    Also:
    1. Du brauchst 'n iframe:
    <iframe style="z-index: 1;position:absolute;display:none;" id="ifr"></iframe>
    (hab ich unmittelbar vor den </body>-Tag gesetzt)

    2. Das select bekommt'n z-index von 0 (jedefalls niedriger als der iframe):
    <select name="liste" style="z-index: 0">
    <option value'lydia'>lydia</option>
    </select>

    3. Alle in Frage kommenden divs erhalten einen höheren z-index als der iframe (oben im css):
    .menu {
    /*vorhandene Zuweisungen*/
    z-index:2;
    }

    4. Wenn ein Menü "aufklappt", iframe sichtbar machen und Position sowie Größe an den Menü-Div anpassen:
    // Position and show the menu.
    button.menu.style.left = x + "px";
    button.menu.style.top= y + "px";
    button.menu.style.visibility = "visible";
    if (browser.isIE){//ab hier neu
    i=document.getElementById('ifr');
    i.style.display = "block";
    i.style.left = x + "px";
    i.style.top= y + "px";
    i.style.width= button.menu.offsetWidth + "px";
    i.style.height= button.menu.offsetHeight + "px";
    }

    5. Wenn Menü zuklappt, iframe verschwinden lassen:
    // Hide the button's menu.
    if (button.menu){
    button.menu.style.visibility = "hidden";
    if (browser.isIE)document.getElementById('ifr').style.display = "none";
    }

    Fertig! Auch wenn's viel code ist - hier das Ganze komplett:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Menubar</title>
    <link href="style.css" rel=stylesheet>
    <style type="text/css">
    #menuBar {
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    color: #000000;
    font-size: 1pt;
    padding: 4px 2px 4px 2px;
    text-align: left;
    width: 80%;
    }
    a.menuButton, a.menuButtonActive {
    background-color: transparent;
    border: 1px solid #c0c0c0;
    color: #000000;
    cursor: default;
    font-family: "MS Sans Serif", Arial, Tahoma, sans-serif;
    font-size: 8pt;
    font-style: normal;
    font-weight: normal;
    margin: 1px;
    padding: 2px 6px 2px 6px;
    position: relative;
    left: 0px;
    top: 0px;
    text-decoration: none;
    }
    a.menuButton:hover {
    background-color: transparent;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    color: #000000;
    }
    a.menuButtonActive, a.menuButtonActive:hover {
    background-color: #a0a0a0;
    border-color: #808080 #f0f0f0 #f0f0f0 #808080;
    color: #ffffff;
    left: 1px;
    top: 1px;
    }
    .menu {
    background-color: #c0c0c0;
    border: 2px solid;
    border-color: #f0f0f0 #808080 #808080 #f0f0f0;
    padding: 0px;
    position: absolute;
    text-align: left;
    visibility: hidden;
    z-index:2;
    }
    a.menuItem {
    background-color: transparent;
    color: #000000;
    cursor: default;
    display: block;
    font-family: "MS Sans Serif", Arial, Tahoma,sans-serif;
    font-size: 8pt;
    font-style: normal;
    font-weight: normal;
    margin: 0px;
    padding: 2px;
    padding-left: 12px;
    padding-right: 16px;
    text-decoration: none;
    white-space: nowrap;
    }
    a.menuItem:hover {
    background-color: #000080;
    color: #ffffff;
    }
    .menuItemSep {
    border-bottom: 1px solid #f0f0f0;
    border-top: 1px solid #808080;
    margin: 3px 4px 3px 4px;
    }
    </style>
    <script type="text/javascript">
    <!-- ---------------------------------------------------- -->
    <!-- Menu Bar Demo-->
    <!---->
    <!-- Copyright 2000 by Mike Hall-->
    <!-- Please see http://www.brainjar.com for terms of use. -->
    <!-- ---------------------------------------------------- -->
    // Determine browser and version.
    function Browser() {
    var ua, s, i;
    this.isIE= false;// Internet Explorer
    this.isNS= false;// Netscape
    this.version = null;
    ua = navigator.userAgent;
    s = "MSIE";
    if ((i = ua.indexOf(s)) >= 0) {
    this.isIE = true;
    this.version = parseFloat(ua.substr(i + s.length));
    return;
    }
    s = "Netscape6/";
    if ((i = ua.indexOf(s)) >= 0) {
    this.isNS = true;
    this.version = parseFloat(ua.substr(i + s.length));
    return;
    }
    // Treat any other "Gecko" browser as NS 6.1.
    s = "Gecko";
    if ((i = ua.indexOf(s)) >= 0) {
    this.isNS = true;
    this.version = 6.1;
    return;
    }
    }
    var browser = new Browser();
    // Global variable for tracking the currently active button.
    var activeButton = null;
    // Capture mouse clicks on the page so any active button can be
    // deactivated.
    if (browser.isIE)
    document.onmousedown = pageMousedown;
    if (browser.isNS)
    document.addEventListener("mousedown", pageMousedown, true);
    function pageMousedown(event) {
    var el;
    // If there is no active menu, exit.
    if (!activeButton)
    return;
    // Find the element that was clicked on.
    if (browser.isIE)
    el = window.event.srcElement;
    if (browser.isNS)
    el = (event.target.className ? event.target : event.target.parentNode);
    // If the active button was clicked on, exit.
    if (el == activeButton)
    return;
    // If the element clicked on was not a menu button or item, close the
    // active menu.
    if (el.className != "menuButton"&& el.className != "menuItem" &&
    el.className != "menuItemSep" && el.className != "menu")
    resetButton(activeButton);
    }
    function buttonClick(button, menuName) {
    // Blur focus from the link to remove that annoying outline.
    button.blur();
    // Associate the named menu to this button if not already done.
    if (!button.menu){
    button.menu = document.getElementById(menuName);
    }
    // Reset the currently active button, if any.
    if (activeButton && activeButton != button)
    resetButton(activeButton);
    // Toggle the button's state.
    if (button.isDepressed)
    resetButton(button);
    else
    depressButton(button);
    return false;
    }
    function buttonMouseover(button, menuName) {
    // If any other button menu is active, deactivate it and activate this one.
    // Note: if this button has no menu, leave the active menu alone.
    if (activeButton && activeButton != button) {
    resetButton(activeButton);
    if (menuName)
    buttonClick(button, menuName);
    }
    }
    function depressButton(button) {
    var w, dw, x, y;
    // Change the button's style class to make it look like it's depressed.
    button.className = "menuButtonActive";
    // For IE, set an explicit width on the first menu item. This will
    // cause link hovers to work on all the menu's items even when the
    // cursor is not over the link's text.
    if (browser.isIE && !button.menu.firstChild.style.width) {
    w = button.menu.firstChild.offsetWidth;
    button.menu.firstChild.style.width = w + "px";
    dw = button.menu.firstChild.offsetWidth - w;
    w -= dw;
    button.menu.firstChild.style.width = w + "px";
    }
    // Position the associated drop down menu under the button and
    // show it. Note that the position must be adjusted according to
    // browser, styling and positioning.
    x = getPageOffsetLeft(button);
    y = getPageOffsetTop(button) + button.offsetHeight;
    if (browser.isIE) {
    x += 2;
    y += 2;
    }
    if (browser.isNS && browser.version < 6.1)
    y--;
    // Position and show the menu.
    button.menu.style.left = x + "px";
    button.menu.style.top= y + "px";
    button.menu.style.visibility = "visible";
    if (browser.isIE){
    i=document.getElementById('ifr');
    i.style.display = "block";
    i.style.left = x + "px";
    i.style.top= y + "px";
    i.style.width= button.menu.offsetWidth + "px";
    i.style.height= button.menu.offsetHeight + "px";
    }
    // Set button state and let the world know which button is
    // active.
    button.isDepressed = true;
    activeButton = button;
    }
    function resetButton(button) {
    // Restore the button's style class.
    button.className = "menuButton";
    // Hide the button's menu.
    if (button.menu){
    button.menu.style.visibility = "hidden";
    if (browser.isIE)document.getElementById('ifr').style.display = "none";
    }
    // Set button state and clear active menu global.
    button.isDepressed = false;
    activeButton = null;
    }
    function getPageOffsetLeft(el) {
    // Return the true x coordinate of an element relative to the page.
    return el.offsetLeft + (el.offsetParent ? getPageOffsetLeft(el.offsetParent) : 0);
    }
    function getPageOffsetTop(el) {
    // Return the true y coordinate of an element relative to the page.
    return el.offsetTop + (el.offsetParent ? getPageOffsetTop(el.offsetParent) : 0);
    }
    </script>
    </head>
    <body>
    <table width=100% cellpadding=3 cellspacing=1 border=0>
    <tr>
    <td class=title2 width="80">Titel</td>
    <td class=body2 width=400>Menubar&nbsp;</td>
    </tr>
    <tr>
    <td class=body2 colspan="2">
    <!-- Tags for the menu bar. -->
    <div id="menuBar"><a class="menuButton" href="" onclick="return buttonClick(this, 'fileMenu');" onmouseover="buttonMouseover(this, 'fileMenu');">File</a>
    <a class="menuButton" href="" onclick="return buttonClick(this, 'editMenu');" onmouseover="buttonMouseover(this, 'editMenu');">Edit</a>
    <a class="menuButton" href="" onclick="return buttonClick(this, 'viewMenu');" onmouseover="buttonMouseover(this, 'viewMenu');">View</a>
    <a class="menuButton" href="" onclick="return buttonClick(this, 'toolsMenu');" onmouseover="buttonMouseover(this, 'toolsMenu');">Tools</a>
    <a class="menuButton" href="" onclick="return buttonClick(this, 'optionsMenu');" onmouseover="buttonMouseover(this, 'optionsMenu');">Options</a>
    <a class="menuButton" href="" onclick="return buttonClick(this, 'helpMenu');" onmouseover="buttonMouseover(this, 'helpMenu');">Help</a></div>
    <!-- Tags for the drop down menus. -->
    <div id="fileMenu" class="menu">
    <a class="menuItem" href="blank.html">File Menu Item 1</a>
    <a class="menuItem" href="blank.html">File Menu Item 2</a>
    <a class="menuItem" href="blank.html">File Menu Item 3</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">File Menu Item 4</a>
    <a class="menuItem" href="blank.html">File Menu Item 5</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">File Menu Item 6</a>
    </div>
    <div id="editMenu" class="menu">
    <a class="menuItem" href="blank.html">Edit Menu Item 1</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Edit Menu Item 2</a>
    <a class="menuItem" href="blank.html">Edit Menu Item 3</a>
    <a class="menuItem" href="blank.html">Edit Menu Item 4</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html" target="_blank"onclick="resetButton(activeButton);return true;">Edit Menu Item 5</a>
    </div>
    <div id="viewMenu" class="menu">
    <a class="menuItem" href="blank.html">View Menu Item 1</a>
    <a class="menuItem" href="blank.html">View Menu Item 2</a>
    <a class="menuItem" href="blank.html">View Menu Item 3</a>
    </div>
    <div id="toolsMenu" class="menu">
    <a class="menuItem" href="blank.html">Tools Menu Item 1</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 2</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 3</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Tools Menu Item 4</a>
    <a class="menuItem" href="blank.html">Tools Menu Item 5</a>
    </div>
    <div id="optionsMenu" class="menu">
    <a class="menuItem" href="blank.html">Options Menu Item 1</a>
    <a class="menuItem" href="blank.html">Options Menu Item 2</a>
    <a class="menuItem" href="blank.html">Options Menu Item 3</a>
    </div>
    <div id="helpMenu" class="menu">
    <a class="menuItem" href="blank.html">Help Menu Item 1</a>
    <a class="menuItem" href="blank.html">Help Menu Item 2</a>
    <div class="menuItemSep"></div>
    <a class="menuItem" href="blank.html">Help Menu Item 3</a>
    </div>
    &nbsp;</td></tr>
    <tr><td>
    <select name="liste" style="z-index: 0">
    <option value'lydia'>lydia lydia lydia lydia lydia</option></select>
    </td></tr>
    </table>
    <iframe style="z-index: 1;position:absolute;display:none;" id="ifr"></iframe>
    </body>
    </html>
    Ich würde das Menü noch so ändern, daß auch bei deaktiviertem JS eine Navigation vorhanden ist! Außerdem errechnet IE so wie das Script damit umgeht die Position der Untermenüs falsch. Aber immerhin weißte jetzt, wie das mit dem iframe und dem select geht.

    Ahoi - Pit

  7. #7
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Hallo Pit,

    super-herzlich-vielen Dank für die Umsetzung.
    Technisch habe ich es verstanden, aber als ich das in mein bestehendes Menü einbauen wollte, funktionierte dieses plötzlich nicht mehr.

    Hätte ich doch gleich einen Fachmann gefragt :-)

    Nicht so schlimm, ich werde Dein Menü nehmen und meine Anpassungen übertragen.

    Nochmals vielen Dank!

    Lieben Gruß
    Lydia.

  8. #8
    pit-r Guest

    AW: Defektes (?) Menü

    Moin!

    Gern geschehen. Wo ist der Kaffee und wo sind die Kekse??
    (Brauch ich aber nich im Ernst: trinke gerade ein Feierabend-Bier).

    Gruß - Pit

  9. #9
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Hallo Pit,

    ich bins nochmal, wollte nur kurz 'ne Rückmeldung machen: Habe mir das Script angeschaut und das meiste verstanden. Werde wohl auch in der Lage sein, die falsch berechnete Position im IE zu korrigieren.

    Nur das mit der Version "ohne Javascript" habe ich von Dir nicht ganz verstanden. Inhaltlich schon, aber layouttechnisch läßt sich das doch garnicht umsetzen?

    Liebe Grüße
    Lydia.

  10. #10
    pit-r Guest

    AW: Defektes (?) Menü

    Hi!
    Zitat Zitat von Lydia.h
    Nur das mit der Version "ohne Javascript" habe ich von Dir nicht ganz verstanden. Inhaltlich schon, aber layouttechnisch läßt sich das doch garnicht umsetzen?
    Wenn jemand die Seite(n) besucht und kein JS am Start hat, was ist dann wichtiger? Das Vorhandensein der Möglichkeit zu navigieren oder das Layout?

    Gruß - Pit

  11. #11
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Das fragst Du ein Mädchen? ts,ts, natürlich das LAYOUT! hihi.
    Nein, im Ernst, da es sich hier um eine interne Verwaltung handelt (ich glaube, man nennt es CMS) und die User alle bekannt sind, ist eine Alternative zu dem Menü nicht nötig.

    Besten Dank aber dennoch für den Hinweis!

    Lydia.

    PS: Sorry, dass ich manchmal so spät antworte, aber ich bekomme keine Mails von diesem Forum?!?!?!

    Lieben Gruß
    Ly.

    Zitat Zitat von pit-r
    Hi!Wenn jemand die Seite(n) besucht und kein JS am Start hat, was ist dann wichtiger? Das Vorhandensein der Möglichkeit zu navigieren oder das Layout?

    Gruß - Pit

  12. #12
    pit-r Guest

    AW: Defektes (?) Menü

    Hi!
    Zitat Zitat von Lydia.h
    PS: Sorry, dass ich manchmal so spät antworte, aber ich bekomme keine Mails von diesem Forum?!?!?!
    Im Benutzerkontrollzentrum => Einstellungen => E-Mails, Private Nachrichten & Benachrichtigungen => Themen abonnieren kannst Du festlegen, ob und wie Du über Posts informiert wirst.

    Gruß - Pit

  13. #13
    Lydia.h ist offline Foren As
    registriert
    25-07-2005
    Beiträge
    94

    AW: Defektes (?) Menü

    Hallo Pit,

    ein blindes Hähnchen findet auch ein Körnchen, wenns der Pit einem vor die Füße wirft! Sorry, ich habe echt mehrmals da rein gekuckt und es nicht gesehen.
    Jetzt läufts :-)

    Besten Dank.
    Ly.

Ähnliche Themen

  1. PopUp Menü rechtsbündig!?
    Von [x]snaKe im Forum JavaScript
    Antworten: 3
    Letzter Beitrag: 14-03-2006, 14:51
  2. Brauche dringend Hilfe bei meinem Menü Script
    Von AEdevil im Forum JavaScript
    Antworten: 15
    Letzter Beitrag: 12-07-2005, 18:29
  3. Dynamisches Menü
    Von kiX im Forum JavaScript
    Antworten: 1
    Letzter Beitrag: 07-03-2005, 13:12
  4. JS Menü mit Dreamweaver... Bildaustausch Problem
    Von Bassbrothermd im Forum JavaScript
    Antworten: 5
    Letzter Beitrag: 10-01-2005, 19:33
  5. dropdown menü
    Von snake14 im Forum JavaScript
    Antworten: 10
    Letzter Beitrag: 26-01-2003, 17:19

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •