Avatar billede jaja8700 Novice
08. maj 2015 - 16:49 Der er 1 kommentar

Scroll menu - hjælp

Hej jeg vil gerne lave scroll menu til nedenstående menu
- har prøvet at lave et css men det virker ikke - kan kan måske indbygge det i selve siden?
Mvh Jette

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title></title>

<style type="text/css">
* { margin: 0; padding: 0; }
body { margin: 20px; }
/* fjern list bullets */
#menu {
    list-style-type: none;
}
#menu ul{
    list-style-type: none;
}
/* da li normalt vises som 'block' skal de floates for at komme på samme linie */
#menu li {
    background: #ffffff;
    color:         #666666;
    padding:     5px;
    width:         150px;
    border-top: 1px inset;
    float: center;
}
#menu li:hover {
    background-color: #ececec;
    color:         #00a400;
}
/* class til menuitems med undermenu  - relativ position
  for at kunne bruge absolut position til undermenuerne */
#menu .sub {
    position:     relative;
    background: url(subitems.JPG) right center no-repeat;
    color:         #666666;
}
#menu .sub:hover {
    background-color:     #ececec;
    color:                 #00a400;
}
/* Funktionalitet */
/* skjul underlister by default */
.sub > ul {
    display:    none;
}
/* Gældende for første niveau, foldud nedad, når ".sub:hover" triggeres,
  forskydelse på 100% af højden. Position i forhold til left bruges for
  at undermenuer kan positiones i forhold til venstre
  *tip*: (hvis forskydelse mod venstre er ønsket, skift left værdierne til right værdier) */
.sub:hover > ul {
    display:     block;
    position:     absolute center;
    top:         100%;
    left:         15px;
}
/* fra 2. niveau og videre, skal det gå mod højre, forskudt 100% af bredden */
.sub:hover .sub:hover > ul {
    top:    0px;
    left:     100%;
}
</style>
<link rel="stylesheet" type="text/css" href="scrolbar_menu.css">
</head>

<body>
<font size="10px">
<!-- Menu HTML -->
</font>
<ul id="menu">
    <li class="sub">
    <p align="left"><font size="2">Byggeregler
    </font></li>
    <li class="sub">
    <p align="left"><font size="2">Formandsliste
        </font>
    </li>
    <li class="sub">
    <p align="left"><font size="2">Haveforeninger
        </font>
    </li>
    <li class="sub">
    <p align="left"><font size="2">Havevurdering
        </font>
    </li>
    <li class="sub">
    <p align="left"><font size="2">Kassererliste
        </font>
    </li>
    <li class="sub">
    <p align="left"><font size="2">Lejekontrakt
        </font>
    </li>
    <li class="sub">
    <p align="left"><font size="2">Udvalg
        </font></li>
</ul>
<!-- Slut menu -->


<p>&nbsp;</p>


</body>
</html>
Avatar billede kris919g Nybegynder
08. maj 2015 - 17:40 #1
Vil anbefale dig at prøve bootstrap! http://getbootstrap.com/ Bootstrap er super nemt at lave full responsive websites og det vil ikke tage mere end 2 min at lave en drop down menu som du kan se her http://getbootstrap.com/components/#dropdowns Håber du kan bruge svaret
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Alle kurser indenfor Microsoft 365 – både til begyndere og øvede.

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester