Forum FAQForum FAQSearchSearch MemberlistMemberlist Forum ignore listForum ignore list RegisterRegister ProfileProfile Log in to check your private messagesLog in to check your private messages Log inLog in
Image rollover u listi

 
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    mi3dot.org Forum Index -> Client-side
View previous topic :: View next topic  
Author Message
blackshtef
mi3.crew


Joined: 13 Sep 2003
Posts: 661

PostPosted: 12.12.2008 01:10    Post subject: Image rollover u listi Add user to your forum ignore list Reply with quote

Ovako, imam prvu listu:
Code:
<ul>
   <li><a href="#">Product overview</a></li>
   <li><a href="#">Features</a></li>
   <li><a href="#">Pricing</a></li>
</ul>


Code:
#sidebar ul {
margin:0px;
padding:0px;
list-style-type: none;
}

#sidebar ul a:link, #sidebar ul a:visited {
display:block;
width:180px;
height:30px;
line-height:30px;
color:#000;
text-decoration:none;
background: #364E60 url(images/rollover.gif) no-repeat left top;
text-indent: 50px;
}

#sidebar ul a:hover {
background-color:#314B5F;
background-position: right top;
color: #fff;
}


ovaj rollover.gif je zapravo file koji ima oba stanja u sebi složena, i link i hover, tzv. Pixy-style metoda.

I to fino funkcionira:


No, na ovoj drugoj listi, svaki list item bi trebao imati različite ikone. Na slici je to označeno kao da su svi obični link, a Buying je u hover stanju.


E, ono što mene zanima, kako to izvesti? Malo mi se nespretno čini ideja da za svaki taj item radim posebni image file i da idem to definirati za svaki LI. Confused

Ima li netko možda ideju kako bi se to fino i elegantno riješilo?
Back to top
View user's profile Send private message Send e-mail MSN Messenger
mile



Joined: 10 Sep 2003
Posts: 1327
Location: Jeruzalem

PostPosted: 12.12.2008 01:37    Post subject: Add user to your forum ignore list Reply with quote

Možeš sva stanja za sve linkove staviti u jednu sliku, svakom li itemu koji treba biti drukčiji dodijeliti klasu ili ID i onda CSS-om samo 'pomicati' pozadinu, tj. tu sliku na kojoj su sva stanja linkova.

Pogledaj ovaj stari članak ako ti nije skroz jasno kako - ukratko, vidim da koristiš pozicioniranje pozadine sa 'top, left' itd. svojsvima, a možeš to i brojčano u pikselima u svim smjerovima (i negativno).

_________________
mile.is
Back to top
View user's profile Send private message Visit poster's website
blackshtef
mi3.crew


Joined: 13 Sep 2003
Posts: 661

PostPosted: 12.12.2008 16:27    Post subject: Add user to your forum ignore list Reply with quote

mile wrote:
Možeš sva stanja za sve linkove staviti u jednu sliku, svakom li itemu koji treba biti drukčiji dodijeliti klasu ili ID i onda CSS-om samo 'pomicati' pozadinu, tj. tu sliku na kojoj su sva stanja linkova.

Pogledaj ovaj stari članak ako ti nije skroz jasno kako - ukratko, vidim da koristiš pozicioniranje pozadine sa 'top, left' itd. svojsvima, a možeš to i brojčano u pikselima u svim smjerovima (i negativno).
TZAR!!1
Back to top
View user's profile Send private message Send e-mail MSN Messenger
Display posts from previous:   
This forum is locked: you cannot post, reply to, or edit topics.   This topic is locked: you cannot edit posts or make replies.    mi3dot.org Forum Index -> Client-side All times are GMT + 1 Hour
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum


Powered by phpBB © 2001, 2005 phpBB Group