CSS pieslēdzam tur kur būs redzama šī izvēlne
Code
#toolbar {
background: url(../images/toolbar.png) 0 0 repeat-x;
height: 40px;
}
#topnav {
}
#topnav ul {
margin: 0;
padding: 0 0px;
}
#topnav li {
margin: 0 2px 0 0;
padding: 0;
position: relative;
list-style: none;
}
#topnav li a {
display: block;
float: left;
line-height: 50px;
padding: 0 12px;
color: #bbb;
font-size: 11px;
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
}
#topnav li a.active {
background: url(../images/topnav_active.png) 0 50% repeat-x;
color: #222;
font-weight: bold;
}
#topnav li a.important {
background: url(../images/navigation/topnav_important.png) 0 50% repeat-x;
color: #ffffff;
text-decoration: underline;
}
#topnav li a:hover, #topnav li:hover a {
background: url(../images/topnav_active.png) 0 50% repeat-x;
color: #1c1c1c;
}
#topnav li:hover li a, #topnav li:hover li a span {
background: none;
}
#topnav li li {
width: 194px;
height: auto;
padding: 0px;
margin: 0px;
}
#topnav li li a, #topnav .active li a, #topnav li:hover li a, #topnav li.sfhover li a {
background: none;
display: block;
height: 26px;
line-height: 26px;
padding: 0 6px;
width: 182px;
float: none;
color: #777;
text-decoration: none;
font-weight: normal;
text-transform: none;
font-size: 12px;
}
#topnav li ul li a:hover {
color: #ddd;
}
#topnav ul li a.subchild, #topnav ul li.sfhover a.subchild {
background: url(../images/topnav_arrow.png) 96% 50% no-repeat;
}
#topnav li ul {
background: #1c1c1c;
border: 1px solid #222;
position: absolute;
height: auto;
width: 194px;
left: -999em;
z-index: 100;
padding: 5px;
}
#topnav li:hover ul, #topnav li.sfhover ul {
top: 50px;
left: 0;
}
#topnav li:hover li ul, #topnav li.sfhover li ul, #topnav li li:hover li ul, #topnav li li.sfhover li ul {
top: -999em;
}
#topnav li li:hover ul, #topnav li li li:hover ul, #topnav li li.sfhover ul, #topnav li li li.sfhover ul {
left: 195px;
top: -5px;
}
HTML ievietojam kur vēlaties, lai parādās izvēlne
Code
<div id="toolbar">
<div id="topnav">
<ul>
<li id="button_home">
<?if($URI_ID$='page1')?>
<a class="active" href="$HOME_PAGE_LINK$">Sākums</a>
<?else?>
<a class="" href="$HOME_PAGE_LINK$">Sākums</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='news')?>
<a class="active" href="/news/">Jaunumi</a>
<?else?>
<a class="" href="/news/">Jaunumi</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='forum')?>
<a class="active" href="/forum/">Forums</a>
<?else?>
<a class="" href="/forum/">Forums</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='board')?>
<a class="active" href="/board/">Anotācijas</a>
<?else?>
<a class="" href="/board/">Anotācijas</a>
<?endif?>
</li>
<li id="button_help">
<?if($URI_ID$='page4')?>
<a class="active" href="/index/tops/0-4">TOPs</a>
<?else?>
<a class="" href="/index/tops/0-4">TOPs</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='publ' && $URI_ID$='puCat3' || $CAT_NAME$='Aktieri')|| $CAT_NAME$='Aktrises' || $CAT_NAME$='Režisori' || $CAT_NAME$='Modeles'?>
<a class="active" href="/publ/slavenibas/3">Slavenības</a>
<?else?>
<a class="" href="/publ/slavenibas/3">Slavenības</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='load')?>
<a class="active" href="/load">Lejuplāde</a>
<?else?>
<a class="" href="/load">Lejuplāde</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='publ' && $URI_ID$='puCat8' || $URI_ID$='puCat1' || $URI_ID$='puCat2' || $URI_ID$='puCat11' || $URI_ID$='puCat1' || $URI_ID$='puCat13' || $URI_ID$='puCat14' || $URI_ID$='puCat15' || $URI_ID$='puCat16' || $URI_ID$='puCat17')?>
<a class="active" href="/publ/video/8">Video</a>
<?else?>
<a class="" href="/publ/video/8">Video</a>
<?endif?>
</li>
<li id="button_help">
<?if($MODULE_ID$='photo')?>
<a class="active" href="/photo">Albūms</a>
<?else?>
<a class="" href="/photo">Albūms</a>
<?endif?>
</li>
<div id="topnav" style="float:right">
<li id="button_help">
<a class="important" href="/forum/0-0-0-36">Noteikumi</a>
</li>
</ul>
</div>
</div>
</div>
Kā redzams kodā, esmu izmantojis IF kodus, lai panāktu darbojošos aktīvo izvēlni! Ta tad, lapā ar 'page1' būs klase "active" bet pārējās lapās šai izvēlnei nebūs klases!
Tālāk jau ir sarežģītāks IF kods!
Quote
<?if($MODULE_ID$='publ' && $URI_ID$='puCat3' || $CAT_NAME$='Aktieri')|| $CAT_NAME$='Aktrises' || $CAT_NAME$='Režisori' || $CAT_NAME$='Modeles'?>
Šeit, lai būtu aktīvā izvēlne, tad IF kods darbojas šādi!
Ja modulis "Publisher" un sadaļa ar ID 3 vai kategorija Aktieri, Aktrises, Režisori vai Modeles tad izvēlne būs aktīva!
Lai panāktu, ka darbojās aktīvā izvēlne, ir jāpārzina IF kodi! Ja tomēr ar IF kodiem neizdodas, tad varat tik un tā izveidot šo izvēlni.
Šādi izskatīsies kods, bez aktīvās izvēlnes!
Code
<li id="button_home">
<a class="" href="$HOME_PAGE_LINK$">Sākums</a>
</li>
Neaizmirstiet lejuplādēt divus attēlus, kas ir pievienoti RAR arhīvā, kurš ir pievienots šī foruma ierakstam!