Neues Backend Menu Teil 2 (+Gewinnspiel)

Seit eingien Tagen gab es kein Update mehr im Code von ContentLion – Das ändert sich heute. Denn es gibt nun DropDown im Menü. Aber vorab müssen wir noch das Entschuldigungs Gewinnspiel auswerten. Der Gewinn geht eindeutig nach Lena! Da ihr egal ist, welches Heaset sie bekommt, bekommt sie das gleiche wie ich. Wie gesagt, nächstes ContentLion Live ist am Mittwoch.

Jetzt aber zurück zum Menü. Unser schönes DropDown Menü funktioniert ohne Javascript! Der Trick bei der Sache ist das :hover aus dem CSS. damit wird das Display unseres Menüs auf block gesetzt. Standardmäßig ist es auf display:none.

Zu erst einmal hab ich ein <div> um unser Menü gemacht, da ansonsten bei mehreren Elementen die globalmenu-ID steht /system/skins/backenddefault/index.php:

      <h1><?PHP echo sys::getTitle(); ?></h1>
      <div id="globalmenu">
        <?PHP
          sys::displayGlobalMenu("<ul>","</ul>","<li>"," </li>",
                                 "");
        ?>
      </div>
      <img src="<?PHP echo sys::getFullSkinPath(); ?>/images/logo.png" id="logo" />

Weiter geht’s mit der style.css:

#globalmenu > ul{
  position:absolute;
  top:86px;
  margin:0;
  padding:0;
  padding-left:10px;
  font-size: 9pt;
  list-style-type:none;
}
#globalmenu li{
  float:left;
  margin-right:10px;
  padding:2px;
}
#globalmenu li ul {
  display:none;
}
#globalmenu li:hover ul {
  display:block;
  list-style-type:none;
  padding:0;
  margin:0;
  background-color:#9f9f9f;
  min-width:100px;
  margin-top:1px;
  position:absolute;
  border:1px solid #000;
  border-top:0;
}
#globalmenu li:hover ul li {
  padding:0;
  margin:0;
  background-color:#9f9f9f;
  float:none;
  height:15px;
  padding-top:5px;
  padding-bottom:5px;
  padding-left:10px;
}

Um auch Elemente angezeigt zu bekommen, hab ich einmal in Datei die Punkte Neu und Schließen eingefügt:

INSERT INTO `cl_menu` (`id`, `menuID`, `title`, `href`, `type`) VALUES
(8, 3, 'Neu', '8', 3),
(9, 3, 'Schließen', 'javascript:window.close()', 1);

Weitere Änderungen stehen bei Google Code unter r16 und r17.

Du arbeitest in einer Agentur oder als Freelancer?
Dann wirf doch mal einen Blick auf unsere Software FeatValue.

Über uns

Wir entwickeln Webanwendungen mit viel Leidenschaft. Unser Wissen geben wir dabei gerne weiter. Mehr über a coding project