15-01-2010, 04:16
(15-01-2010, 03:17)superman napisał(a): Z tym co kolega tutaj napisał to nie wiem czy dam radę ale znalazłem fajną stronkę i mi się spodobała http://pclab.pl/plik298_EasyBCD.1.7.2.html jak można wykonać takie przyciski w header i żeby po najechaniu tak jak na tej stronce zmieniał się kolor - czy to trudno zrobić?
Masz dla orientacji odchudzone menu z takiej stronki
Nie zalecam kopiowania ale przypatrz się jak są dane wywoływane
Kod:
<style>
#header .left .menu{width:610px;padding:5px 10px 0 5px;height:40px;float:left;background:url(http://pclab.pl/img/menu_back.png) no-repeat;}
#header .left .menu ul{margin:0;padding:0;}
#header .left .menu ul li{float:left;list-style:none;}
#header .left .menu a{float:left;outline:none;padding-top:8px;height:32px;font-family:tahoma,sans-serif;font-size:12px;font-weight:bold;color:#FFF;text-decoration:none;text-align:center;}
#header .left .menu a{background:url(http://pclab.pl/img/menu.png) no-repeat;}
#header .left .menu a.home{width:29px;background-position:0 0;}
#header .left .menu a.articles{width:79px;background-position:-29px 0;}
#header .left .menu a.news{width:98px;background-position:-108px 0;}
#header .left .menu a.files{width:60px;background-position:-206px 0;}
#header .left .menu a.tags{width:60px;background-position:-206px 0;}
#header .left .menu a.contests{width:81px;background-position:-266px 0;}
#header .left .menu a.board{width:63px;background-position:-347px 0;}
#header .left .menu a.personalize{padding-right:22px;width:125px;background-position:-410px 0;}
#header .left .menu a.home:hover{background-position:0 -32px;}
#header .left .menu a.articles:hover,#header .left .menu .active a.articles{background-position:-29px -32px;}
#header .left .menu a.news:hover,
#header .left .menu .active a.news{background-position:-108px -32px;}
#header .left .menu a.files:hover,#header .left .menu .active a.files{background-position:-206px -32px;}
#header .left .menu a.tags:hover,#header .left .menu .active a.tags{background-position:-206px -32px;}
#header .left .menu a.contests:hover{background-position:-266px -32px;}
#header .left .menu a.board:hover{background-position:-347px -32px;}
#header .left .menu a.personalize:hover{background-position:-410px -32px;}
</style>
<body>
<div id="header">
<div class="left">
<div class="menu" style="width: 616px">
<ul style="width: 621px; height: 70px;">
<li><a class="home" href="/"></a></li>
<li><a class="articles" href="art.html">Artykuły</a></li>
<li><a class="news" href="news.html">Aktualności</a></li>
<li><a class="files" href="pliki.html">Pliki</a></li>
<li><a class="tags" href="tag.html">Tagi</a></li>
<li><a class="contests" href="tag.html=konkurs">Konkursy</a></li>
<li>
<a class="board" href="http://forum.pclab.pl/" style="height: 32px">Forum</a></li>
<li><a class="personalize" href="#">Personalizuj</a></li>
</ul>
</div>
</div>
</div>
</body>
Projektowanie stron/serwisów internetowych ... zapraszam do kontaktu na priv
Dane kontaktowe podane w profilu
Dane kontaktowe podane w profilu