Menu uit database horizontaal weergeven

Status
Niet open voor verdere reacties.

gekkeabt

Gebruiker
Lid geworden
9 jul 2010
Berichten
59
Hallo allemaal,

ik ben al 2 dagen bezig met het maken van een eiegen cms.

Ik wilde vragen, dat ik op een of andere manier templates kan laten gebruiken op mijn cms door middel van echo codes.
Alleen als ik nou de menu tevoorschijn haal dan is die verticaal.
Verder is alle data goed alleen moet die horizontaal zijn.
( net als bij http://www.apple.com/ )
Weet iemand misschien hoe je de menu vanuit de database horizontaal kan krijgen.
De css style ziet er goed uit en als ik gewoon met html code menu's maak dan komen die er wel horizontaal erin.


Alvast bedankt ;)
 
Het horizontaal weergeven van een menu
wordt gedaan door aan de html-markup een stijl mee te geven.

Dat gaat heel goed als je een <ul>-lijst gebruikt
waarbij elke <li> een menu-optie weergeeft.

In je CSS geef je dan bijvoorbeeld aan de selector "li" de volgende rule mee:
li { display: inline; }

Ik doe dat hier voor het gemak even als embedded css (style in de head-sectie),
maar dat kan natuurlijk ook in een externe stylesheet.

HTML:
<head>
<style type="text/css">
#menu li { display: inline; }
</style>
</head>
<body>
<ul id="menu">
<li><a href="#">menu-optie 1</a></li>
<li><a href="#">menu-optie 2</a></li>
<li><a href="#">menu-optie 3</a></li>
<li><a href="#">menu-optie 4</a></li>
</ul>
</body>


Het horizontaal maken van je menu heeft natuurlijk vrij weinig met je database te maken.
Dat wil zeggen:
je slaat je html op in je database;
wanneer een pagina op het scherm moet worden weergegeven
wordt de html-code uit je database geparst door een browser en
op dat moment wordt met behulp van de CSS het menu horizontaal weergegeven.


En ik kan dit even niet laten:
ik ben al 2 dagen bezig met het maken van een eiegen cms.
Dat klinkt alsof je dat lang vindt, maar voor een heel CMS zijn twee dagen natuurlijk pas het begin. Toch?
 
Dat klinkt alsof je dat lang vindt, maar voor een heel CMS zijn twee dagen natuurlijk pas het begin. Toch?

Ja, als 13/14 jarige zou je wel wat minder tijd moeten verspillen aan dat soort dingen en werken aan school en vrije tijd ergens anders doen.
Maar eigenlijk is die al klaar, alleen moeten er een paar dingen bijgepast worden en wat style toegevoegd worden.

Maar bedankt dat je het hebt beantwoord :D
Eigenlijk was het bedoeld voor php code, maar de dingen die hierin weergeven worden heb ik daarin toegevoegd :
$menuDisplay .= '<li><a href="index.php?pid=' . $pid . '">' . $linklabel . '</a></li>';

<div id="menu">
<ul>
<?php echo $menuDisplay; ?>
</ul>
</div>

en dan de style : ( ik heb iets met float gedaan en dat is ook gelukt :) )
#menu {
width: 980px;
height: 46px;
margin: 0 auto;
padding: 15px 0px 0px 0px;
}

#menu ul {
margin: 0;
padding: 0px 0px 0px 4px;
list-style: none;
line-height: normal;
}

#menu li {
float: left;
}

#menu a {
display: block;
float: left;
height: 24px;
padding: 4px 30px 0px 30px;
text-decoration: none;
text-transform: lowercase;
text-shadow: #8A5608 0px 1px 1px;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
font-weight: normal;
color: #FFFFFF;
border: none;
}

#menu li.current_page_item {
background: url(images/img09.jpg) no-repeat left top;
}

#menu .current_page_item a {
background: url(images/img10.jpg) no-repeat right top;
}

#menu a:hover {
text-decoration: underline;
}


Bedankt voor je hulp hé !
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan