Jaunākie ieraksti Lietotāji Noteikumi Meklēt
  • Lappuse 1 no 1
  • 1
Forums » Datorlietas » Mājaslapu Izstrādes Pamācības » Galvenā izvēlne tumšiem dizainiem! (sml[settings])
Galvenā izvēlne tumšiem dizainiem!
jackass
Date: Otrdiena, 16 Nov 2010, 5:06 PM | Ieraksts # 1


Pakāpe:

Ieraksti: 194

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!




Pielikums: 6258234.png (11.7 Kb) · Desktop.rar (0.6 Kb)

 
Naureens
Date: Otrdiena, 16 Nov 2010, 8:30 PM | Ieraksts # 2


Pakāpe:

Ieraksti: 14
Mjaa- normālā Di*** biggrin
Nu lab kr4.
1) CSS kods- kur vins konkreti jaliek CSS šablona ? vai kkur citur ? Pasaki piemeru... =/
2) Tad janomaina bilzu linki- tas poh.
3) Ar tiem if kodiem- lai man izvadītu to izvēlni man tur ir kkas jāmaina arī ? Man paslaik vajag tikai tik tālu lai es varu redzēt kā man vins izskatas un lai pec tam pats vinu var rediģēt.

$MODULE_ID$ $URI_ID$ - Tie man pasam jataisa, vai kā ?

Itkā visu caurmērā izskatot- saprotu, bet mēgināju visādi- visu laiku man tur tie visi linki rādas vienā strīpā, un nekas nemainās biggrin Vnk neizvada tās bildes vai, kas hwz



Ierakstu laboja Naureens - Otrdiena, 16 Nov 2010, 8:43 PM
 
jackass
Date: Otrdiena, 16 Nov 2010, 9:00 PM | Ieraksts # 3


Pakāpe:

Ieraksti: 194
Quote (Naureens)
1) CSS kods- kur vins konkreti jaliek CSS šablona ? vai kkur citur ? Pasaki piemeru... =/

Kāda starpība kur liek, galvenais lai ir pieslēgts webam, vari likt tur kur ir uCozam CSS un vari ielikt failu menidžerī un pieslēgt starp head tagiem

Quote (Naureens)
3) Ar tiem if kodiem- lai man izvadītu to izvēlni man tur ir kkas jāmaina arī ? Man paslaik vajag tikai tik tālu lai es varu redzēt kā man vins izskatas un lai pec tam pats vinu var rediģēt.

Tie IFi ir domāti, lai tev izvēlnei iekrāsojās aktīvā daļa! ta tad, ja atrodies forumā tad aktīva būs foruma poga

Quote (Naureens)
Itkā visu caurmērā izskatot- saprotu, bet mēgināju visādi- visu laiku man tur tie visi linki rādas vienā strīpā, un nekas nemainās Vnk neizvada tās bildes vai, kas hwz

Izklausās ka CSS nav pieslēgts!


 
Naureens
Date: Piektdiena, 19 Nov 2010, 5:44 PM | Ieraksts # 4


Pakāpe:

Ieraksti: 14
Meņu nestrādā uz Google Chrome un Explorer pārlūka..
 
jackass
Date: Sestdiena, 20 Nov 2010, 0:47 AM | Ieraksts # 5


Pakāpe:

Ieraksti: 194
Jūtu viņiem līdz, tiem kas lieto biggrin

 
moonwalker
Date: Sestdiena, 20 Nov 2010, 4:08 PM | Ieraksts # 6


Pakāpe:

Ieraksti: 9
Ar laiku rādīs nebaidies
JAckass, ja tev ir iespeja vari padalīties ar login un search paneli
 
MarcisLV
Date: Svētdiena, 28 Nov 2010, 3:03 PM | Ieraksts # 7


Pakāpe:

Ieraksti: 57
Un vispār ja kas uCoz vietnes vislabāk, visprecīzāk iet uz FireFox pārlūkiem, akā citus brauzerus lietot nau jēga jo tad daudz kas var nestrādāt

uForums.GameHost.lv - Universal Community Forum - Latvia - Join For Free Now
 
Forums » Datorlietas » Mājaslapu Izstrādes Pamācības » Galvenā izvēlne tumšiem dizainiem! (sml[settings])
  • Lappuse 1 no 1
  • 1
Meklēšana:
Uz augšu