Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Definisanje hovera za svaki link
Author Message
stefo Offline
Forumaš
***

Posts: 443
Joined: Jun 2006
Reputation: 3
Post: #1
Definisanje hovera za svaki link
Radim jedan sajt i zapeo sam. Moj prijatelj je odradio dizajn u Photoshopu a ja sam to prebacio u web format(izrezao slicice i napravio CSS kod).

U attachmentu sam prilozio sliku headera. I sad u ovim kukicama se nalaze linkovi. I mene zanima kako da definisem za svaki link poseban a:hover?
Znaci link koji se nalazi u zelenoj kukici da ima zelenu boju kad se predje preko njega misem.


Attached File(s) Thumbnail(s)
   

Kako kokoshka abortira? Snese jaje na beton.

http://www.stefosimple.co.nr - nekad bilo, sad se spominjalo :(
13-08-2008 02:58 PM
Find all posts by this user Quote this message in a reply
Morrissey Offline
Forumaš
***

Posts: 695
Joined: Mar 2007
Reputation: 13
Post: #2
RE: Definisanje hovera za svaki link
Prvo trebaš html markup za svaki od njih :
Code:
<a class="green" href="#">Link 1</a>
<a class="blue" href="#">Link 2</a>
<a class="orange" href="#">Link 3</a>
<a class="velvet" href="#">Link 4</a>
onda CSS :
Code:
a:hover .green
{
  color: green;
}

a:hover .blue
{
  color: blue;
}

a:hover .orange
{
  color: orange;
}

a:hover .velvet
{
  color: velvet;
}
(This post was last modified: 13-08-2008 04:43 PM by Morrissey.)
13-08-2008 04:41 PM
Find all posts by this user Quote this message in a reply
stefo Offline
Forumaš
***

Posts: 443
Joined: Jun 2006
Reputation: 3
Post: #3
RE: Definisanje hovera za svaki link
Nece. Pazi imam divider koji se zove header,a unutar njega je divider koji se zove meni.
Probao sam tvoj nacin i jos par nacina ali ne ide.

Kako kokoshka abortira? Snese jaje na beton.

http://www.stefosimple.co.nr - nekad bilo, sad se spominjalo :(
13-08-2008 05:30 PM
Find all posts by this user Quote this message in a reply
Morrissey Offline
Forumaš
***

Posts: 695
Joined: Mar 2007
Reputation: 13
Post: #4
RE: Definisanje hovera za svaki link
Ajd mi uploadaj te fajlove pa ću se poigrat.
13-08-2008 05:37 PM
Find all posts by this user Quote this message in a reply
Len0 Offline
Forumaš
***

Posts: 303
Joined: Mar 2007
Reputation: 3
Post: #5
RE: Definisanje hovera za svaki link
HTML
Code:
<div id="green"><a  href="#">Link 1</a></div>
<div id="blue"><a  href="#">Link 2</a></div>
<div id="orange"><a  href="#">Link 3</a></div>
<div id="velvet"><a  href="#">Link 4</a></div>
CSS
Code:
#green a:hover
{
  color: green;
}

#blue a:hover
{
  color: blue;
}

#orange a:hover
{
  color: orange;
}

#velvet a:hover
{
  color: velvet;
}
Probaj ovako, trebalo bi da radi.

["hip","hip"]
(hip hip array!)
13-08-2008 09:31 PM
Find all posts by this user Quote this message in a reply
Morrissey Offline
Forumaš
***

Posts: 695
Joined: Mar 2007
Reputation: 13
Post: #6
RE: Definisanje hovera za svaki link
Velika greška LenO, id-ove se treba izbjegavat.
Posebno tolko nepotrebnih divova jer markup mora biti minimalistički što je moguće više.
Tj nije tehnička greška ali je greška dizajna općenito.

Ovo treba radit moje no neznam njegov markup tako da mi je teško reć dok ne vidim.

EDIT: zaboravio sam da tako to nejde, evo rješenja koje radi provjereno

Code:
<html>

<head>
<title> Hover linkovi </title>
<style type="text/css" media="screen">
.green:hover {
  color: green;
}
.blue:hover {
  color: blue;
}
.orange:hover {
  color: orange;
}
.purple:hover {
  color: purple;
}
</style>
</head>

<body>

<a class="green"  href="#">Link 1</a>
<a class="blue"   href="#">Link 2</a>
<a class="orange" href="#">Link 3</a>
<a class="purple" href="#">Link 4</a>

</body>
</html>
(This post was last modified: 13-08-2008 10:54 PM by Morrissey.)
13-08-2008 10:29 PM
Find all posts by this user Quote this message in a reply
Post Reply 


Forum Jump:


User(s) browsing this thread: 1 Guest(s)