...

View Full Version : hover with dreamweaver?



alaios
02-19-2004, 10:31 PM
Hi there....I use the dreamweaver as an editor for my stylesheets.
I have already changed the appearance of the <a > tag using the following code:
a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FF0000;
background-color: #CCCCCC;
}

How can I add the hover attribute.........
the visited?
any other options available?

mindlessLemming
02-19-2004, 11:48 PM
You add them the same way as the 'a' attributes were set.
The order IS important, however.....


a:link{..............}
a:visited{...........................}
a:hover{..............................}
a:active{............................}

Hope that clears it up.

alaios
02-20-2004, 12:05 AM
thx/..is your syntax correct?
Why dreamweaver MX 2004 does not have this attributes in the css editor? Is it possible to add them somehow?

alaios
02-20-2004, 12:08 AM
It doesn't seem to work
a {
link: #CCCCCC;
visited: #CCCCCC;
hover: #CCCCCC;
active: #CCCCCC;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;

}

any ideas?

alaios
02-20-2004, 12:37 AM
These errors were produced by the dreamweaver's tag validation
Suggestions?


Error CSS property active is not supported
Microsoft Internet Explorer 5.0, Microsoft Internet Explorer 5.5, Microsoft Internet Explorer 6.0, Netscape Navigator 6.0, Netscape Navigator 7.0, Opera 6.0, Opera 7.0
line 26 a { link: #CCCCCC; visited: #CCCCCC; hover: #CCCCCC; active: #CCCCCC; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }

Error CSS property hover is not supported
Microsoft Internet Explorer 5.0, Microsoft Internet Explorer 5.5, Microsoft Internet Explorer 6.0, Netscape Navigator 6.0, Netscape Navigator 7.0, Opera 6.0, Opera 7.0
line 25 a { link: #CCCCCC; visited: #CCCCCC; hover: #CCCCCC; active: #CCCCCC; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }

Error CSS property link is not supported
Microsoft Internet Explorer 5.0, Microsoft Internet Explorer 5.5, Microsoft Internet Explorer 6.0, Netscape Navigator 6.0, Netscape Navigator 7.0, Opera 6.0, Opera 7.0
line 23 a { link: #CCCCCC; visited: #CCCCCC; hover: #CCCCCC; active: #CCCCCC; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; }

Nightfire
02-20-2004, 12:45 AM
Look at lemming's post again. He hasn't put everything inside the a{} They are to be added separately.

a{}
a:link{}
a:visited{}

etc

freak
02-20-2004, 01:09 AM
I suggest that everyone reading this thread have a read through the following site: http://dbaron.org/css/1999/09/links

// freak

alaios
02-20-2004, 02:50 AM
thx guys . I ll check it tommorow

mindlessLemming
02-20-2004, 03:47 AM
Originally posted by alaios
thx/..is your syntax correct?


Yes.
Dreamweaver has a button labelled "Code View"...
Don't be afraid.....:rolleyes:

Paul Jr
02-20-2004, 05:09 AM
Originally posted by mindlessLemming
Yes.
Dreamweaver has a button labelled "Code View"...
Don't be afraid.....:rolleyes:
Lol.
"Don't be afraid... step into the light."

alaios
02-21-2004, 12:13 AM
Ok. It works fine now.Something more if u can help
How i must put hover link and visited for a style?

What i must add inside bottom?
<style type="text/css">
<!--
.bottom {color: #FFFFFF}

-->
</style>

Thx!

alaios
02-21-2004, 11:14 PM
Plz help i have to deliver it soon :(

Nightfire
02-21-2004, 11:34 PM
.bottom:hover {

mindlessLemming
02-21-2004, 11:51 PM
If you want IE to apply the :hover selector on an element which is not an <a> tag, you will need to use this behaviour hack (http://www.xs4all.nl/~peterned/csshover.html).
Which will invalidate your CSS...
If anyone has a way of doing this without invalid markup, I'm all ears :D

alaios
02-22-2004, 01:49 AM
IS this correct?
<style type="text/css">
<!--
.bottom {
color: #000000;
background-color: #CCCCCC;
}
.bottom:hover {
color: #000000;
background-color: #003333;
}
-->
</style>


If i want a table and his sub-tables to have the bottom stylesheet what i must do?
Thx

mindlessLemming
02-22-2004, 02:11 AM
Yes, but you don't need to give the :hover a color if it is the same as its parent; it will inherit the color.

<table class="bottom">

will cause the whole table to change on hover.

<tr class="hover"> will affect that row and so on.....

alaios
02-22-2004, 02:41 AM
I did not understand something and u will be very kind if u continue helping me.
I change the code to
.bottom {
color: #000000;
background-color: #CCCCCC;
}
.bottom:hover {
color: #FFFFFF;
background-color: #003333;
}
.bottom:visited {
color: #FFFFFF;
background-color: #003333;
}


I have two tables as bellow
<table>

alaios
02-22-2004, 02:45 AM
I did not understand something and u will be very kind if u continue helping me.
I change the code to
.bottom {
color: #000000;
background-color: #CCCCCC;
}
.bottom:hover {
color: #FFFFFF;
background-color: #003333;
}
.bottom:visited {
color: #FFFFFF;
background-color: #003333;
}


I have two tables as bellow
<table>
<table>
</table>
</table>

I want everything in these tables to have the colors of bottom hover and visited.
I have tried the followin but it didn't work
<div align="center" class="bottom">
<table>
<table>
</table>
</table>
</div>

I also tried to add the class in the table or in the tr and the td but nothing at all did work.
Note: The page has a stylesheet used with
<link href="stylesheets/basic.css" rel="stylesheet" type="text/css">

I want all the page use the colors of basis.css and the two tables that i described just above have the colors of the bottom.
Is this possible?
Plz help
I understand that i bother but plz help

mindlessLemming
02-22-2004, 03:24 AM
OK, first up;
only <a> tags can use :visited.
Second, the class="bottom" should be on the actual element you wish to affect, not its parent element. (the table, td or tr, not the div)

Third, and most important: This absolutely will not work in any version of Internet Exporer or any Microsoft browser.
To do so, you must use the behaviour hack which I posted I link to earlier.
Andrew

bradeck
03-03-2004, 10:57 PM
How do you 'embed' a hover tag -

i.e. <a style="color: #072969;" href="comingevents.asp">test</a>

Ive got the link color but simply want a hover color. Thanks in advance for the help.

missing-score
03-03-2004, 11:05 PM
Hi

If you need some information the "Search" option is usually very useful. I searched for "Link Hover", and found this thread: http://www.codingforums.com/showthread.php?s=&threadid=33535&highlight=link+hover

bradeck
03-03-2004, 11:09 PM
First, I found this thread through search. Thanks for the assumption of stupidity.

Second, that link does no more to answer the question than the thread we are in.

Roy Sinclair
03-03-2004, 11:21 PM
Originally posted by bradeck
First, I found this thread through search. Thanks for the assumption of stupidy.

Second, that link does no more to answer the question than the thread we are in.

http://www.w3.org/TR/css-style-attr#cascading -- it's right there.

Of course you could have found that using the search except you're thinking "embed" when the search term you needed is "inline".

bradeck
03-03-2004, 11:48 PM
THANKS - you rock.

Not working though.

I have:

<a style="{color: #072969;} :hover {color: #FF0000}" href="comingevents.asp#Link6">test</a>

What am I missing?

missing-score
03-04-2004, 12:16 AM
ahhh I understand now.

When you said embed I assumed you meant that you wanted it in a CSS file. Didnt think about inline, sorry about that.

bradeck
03-04-2004, 06:49 AM
Appreciate it. Sorry for the poor wording.

Roy Sinclair
03-04-2004, 04:54 PM
Originally posted by bradeck
THANKS - you rock.

Not working though.

I have:

<a style="{color: #072969;} :hover {color: #FF0000}" href="comingevents.asp#Link6">test</a>

What am I missing?

I'm sorry to report that's apparently only a working draft right now and none of the browsers have seem to have implemented it. That means you're still stuck with specifing those kinds of rules in a separate <style></style> block for now.

bradeck
03-05-2004, 03:07 AM
thanks Roy. How can I get just the hover value added to any current ccs settings that may already be applied by another class?

Roy Sinclair
03-05-2004, 04:21 PM
You may have to resort to using javascript like this:



<somehtmlelement onmouseover="this.style.color='#FF0000'" onmouseout="this.style.color='#000000'">...</somehtmlelement>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum