Jump to content
php.lv forumi

Navigacijas izveide no *gif faila


Gstyle

Recommended Posts

Vēl viens plus šai tehnikai ir, ka tad nav vajadzīgs image preloading. Parastajā variantā ar diviem attēliem pogai (viens bez hover, otrs priekš hover), hover pogas attēls tiks ielādēts tikai, tad, kad uz tās uzbrauks virsū. Šo aizturi parasti var redzēt. It īpaši ja nets lēns.

Link to comment
Share on other sites

menu tika veiksmiigi izveidots sagraizot bildiites, bet kaa lai aizpilda atlikusho lauku ar background bildi? Izveelnes ir tikai 4 ,atlikushais lauks palieks tukss. Ne background: #color; ne repeat-x; nedarbojas :(

 

bilde1|bilde2|bilde3|bilde4|emty space,empty space|

Link to comment
Share on other sites

nesanaak, uz IE darbojas FF nee.

seku reku mans kods:

 

.menu {
margin: 0;
padding: 0;
list-style: none;
background: #FFFFFF;
}
.menu li {
padding: 0;
margin: 0;
height: 40px;
list-style: none;
background-repeat: no-repeat;
}
.menu li a, .menu li a:visited {
display: block;
text-decoration: none;
text-indent: -1000px;
height: 40px;
background-repeat: no-repeat;
}
.main {background-image: url(bla_hover.png); width: 83px;}
.main a {background-image: url(bla.png);}
.news {background-image: url(bla2_hover.png); width: 97px;}
.news a {background-image: url(bla2.png);}
.radio {background-image: url(bla3_hover.png); width: 100px;}
.radio a {background-image: url(bla3.png);}
.forum {background-image: url(bla4_hover.png); width: 122px;}
.forum a {background-image: url(bla4.png);}
ul.menu li a:hover {background: none;}
.menu li {float: left;}
.menu:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}

 

 

<div id="topmenu">
<ul class="menu">
<li class="main"><a href="#">bla</a></li>
<li class="news"><a href="#">bla</a></li>
<li class="radio"><a href="#">bla</a></li>
<li class="forum"><a href="#">bla</a></li>
</ul>
</div>

Edited by Gstyle
Link to comment
Share on other sites

×
×
  • Create New...