Mod Dropdown menu - phpBBservice.nl Archief

C

cubaplaza

#1

Ik heb onderstaande mod voor een dropdownmenu gevonden.
Wáár en hoe in de overall-header moet deze geplaatst worden?
En welk gedeelte van het huidige menu kan ik dan weghalen?

Code: Selecteer alles

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Menu - demo</title>
    <style type="text/css">
    * {margin: 0; padding: 0;}
    #menu {height: 30px; border-bottom: 5px solid #10B8D1;}
    #menu ul {visibility: hidden; position: absolute; top: 100%; left: 0;}
    #menu li {float: left; padding-right: 1px; position: relative; list-style: none;}
    #menu li li a {width: 140px;}
    #menu li li {float: none; padding-top: 1px; width: 160px;}
    #menu li:hover ul {visibility: visible;}
    #menu a, #menu li:hover li a, #menu li span {display: block; font: bold 12px/30px Arial, sans-serif; text-decoration: none; padding: 0 10px; color: #fff;}
    #menu, #menu li li, #menu a, #menu li:hover li:hover a {background-color: #0080BF;}
    #menu li span {cursor: default;}
    #menu li a.first, #menu li a.first:hover, #menu li:hover li a, #menu li:hover a, #menu li:hover span {background-color: #10B8D1;}
    </style>
    </head>
    <body>

    <ul id="menu">
    <li><a class="first" href="#/" title="home">Home</a></li>
      <li><span>Menu item 1</span>
        <ul>
          <li><a href="#">Menu item 1.1</a></li>
          <li><a href="#">Menu item 1.2</a></li>
          <li><a href="#">Menu item 1.3</a></li>
         <li><a href="#">Menu item 1.4</a></li>
         <li><a href="#">Menu item 1.5</a></li>
         <li><a href="#">Menu item 1.6</a></li>
         <li><a href="#">Menu item 1.7</a></li>
        </ul>
      </li>
      <li><span>Menu item 2</span>
        <ul>
          <li><a href="#">Menu item 2.1</a></li>
          <li><a href="#">Menu item 2.2</a></li>
          <li><a href="#">Menu item 2.3</a></li>
          <li><a href="#">Menu item 2.4</a></li>
          <li><a href="#">Menu item 2.5</a></li>
          <li><a href="#">Menu item 2.6</a></li>
        </ul>
      </li>
      <li><span>Menu item 3</span>
        <ul>
          <li><a href="#">Menu item 3.1</a></li>
          <li><a href="#">Menu item 3.2</a></li>
          <li><a href="#">Menu item 3.3</a></li>
          <li><a href="#">Menu item 3.4</a></li>
          <li><a href="#">Menu item 3.5</a></li>
        </ul>
      <li><span>Menu item 4</span>
        <ul>
          <li><a href="#">Menu item 4.1</a></li>
          <li><a href="#">Menu item 4.2</a></li>
          <li><a href="#">Menu item 4.3</a></li>
          <li><a href="#">Menu item 4.4</a></li>
        </ul>

       <li><a href="#" title="Menu item etc">Menu item etc</a></li>

    </ul>

    </body>
    </html>

C

cubaplaza

#2

Dom, dom, dom...
Ik had beter eerst de antwoorden van de deskundigen alhier kunnen afwachten, alvorens zelf te gaan sleutelen.
Nu zit ik met de gebakken peren

Dat is in ieder geval de les die ik vandaag geleerd heb.

K

Kevin

#3

Een deel van die code moet je laten vervallen een ander deel kun je in de theme bestanden kwijt en het stukje code wat het menu genereert moet dan in je overall_header geplaatst worden, net onder of net boven je site logo.