473,324 Members | 2,002 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,324 software developers and data experts.

hover table color?

roN
Hi, I have a table with some links in it and I would like to color the whole
cell when someone is moving his cursor over it, how can i do that, right
now it looks like:
[html]
<tr>
<td height="42" class="frontboxtextandline"><a href="#">Features, Options
&amp; Specifications</a></td>
</tr>
<tr>
<td height="42" class="frontboxtextandline"><a href="#">Interactive Product
Demonstration</a></td>
</tr>
[/html]
[css]
..frontboxtextandline a:hover{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
vertical-align: middle;
background-color: fac9a2;
text-decoration:none;
}
..frontboxtextandline a:link{
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #000000;
vertical-align: middle;
text-decoration:none;
}
[/css]
which colors just the text on mouse-over but i'd like to color the whole
cell. Thank you!
--
chEErs roN

I'm root, I'm allowed to do this! ;)
keep on rockin'
Apr 3 '06 #1
18 4546
roN wrote:
Hi, I have a table with some links in it and I would like to color the
whole cell when someone is moving his cursor over it, how can i do that,
right now it looks like:


[snip]

Looks like a list, not a set of tabular data. Lists can be nicely styled:
http://css.maxdesign.com.au/listamatic/

--
David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
Home is where the ~/.bashrc is
Apr 3 '06 #2
roN
David Dorward wrote:
roN wrote:
Hi, I have a table with some links in it and I would like to color the
whole cell when someone is moving his cursor over it, how can i do that,
right now it looks like:


[snip]

Looks like a list, not a set of tabular data. Lists can be nicely styled:
http://css.maxdesign.com.au/listamatic/


Oh no, I gotta take tables because I have some other things in there which I
need defined like a table, is there no way doin' it by tables?
--
chEErs roN

I'm root, I'm allowed to do this! ;)
keep on rockin'
Apr 3 '06 #3
roN
roN wrote:
David Dorward wrote:
roN wrote:
Hi, I have a table with some links in it and I would like to color the
whole cell when someone is moving his cursor over it, how can i do that,
right now it looks like:


[snip]

Looks like a list, not a set of tabular data. Lists can be nicely styled:
http://css.maxdesign.com.au/listamatic/


Oh no, I gotta take tables because I have some other things in there which
I need defined like a table, is there no way doin' it by tables?


There you go with the whole thing:
http://paykiosks.net/new/mockup/new_index.htm
--
chEErs roN

I'm root, I'm allowed to do this! ;)
keep on rockin'
Apr 3 '06 #4
roN wrote:
roN wrote:
Oh no, I gotta take tables because I have some other things in there which
I need defined like a table, is there no way doin' it by tables?

There you go with the whole thing:
http://paykiosks.net/new/mockup/new_index.htm


Doesn't look like tabular data.
--
Johannes Koch
Spem in alium nunquam habui praeter in te, Deus Israel.
(Thomas Tallis, 40-part motet)
Apr 3 '06 #5
roN
Johannes Koch wrote:
roN wrote:
roN wrote:
Oh no, I gotta take tables because I have some other things in there
which I need defined like a table, is there no way doin' it by tables?

There you go with the whole thing:
http://paykiosks.net/new/mockup/new_index.htm


Doesn't look like tabular data.


Okay, how do you like that:http://paykiosks.net/new/mockup/new_index.htm
but it's working with Firefox and Konqueror nicely but not with IE. Why not?
Thank you for some help in that browser issue!
--
chEErs roN

I'm root, I'm allowed to do this! ;)
keep on rockin'
Apr 3 '06 #6
RC
Try this:

<script language="JavaScript">

function highLightRow(thisRow) {
thisRow.bgColor = "yellow";
}

function backToNormal(thisRow) {
thisRow.bgColor = "white";
}
</script>

<tr bgColor="white"
onMouseOver="highLightRow(this)"
onMouseOut="backToNormal(this)">

<th>Header</th><td>data</td>
</tr>

You can do onMouseOver, onMouseOut on individual <th>, <td> tags too.
Apr 4 '06 #7
RC wrote:
Try this:

<script language="JavaScript">

function highLightRow(thisRow) {
thisRow.bgColor = "yellow";
}

function backToNormal(thisRow) {
thisRow.bgColor = "white";
}
</script>

<tr bgColor="white"
onMouseOver="highLightRow(this)"
onMouseOut="backToNormal(this)">

<th>Header</th><td>data</td>
</tr>

You can do onMouseOver, onMouseOut on individual <th>, <td> tags too.


Yuck, Javascript to solve a CSS issue? I did not know IE didn't
acknowledge the hover pseudoclass on non-link elements, I merely thought
it was a specific issue on this page, though I could not find it during
my quick scan of the page... But perhaps you're right. Happen to have a
link to a bug/workaround description wrt this issue? I try and collect
all/most of the IE bugs in my bookmarks.

Sh.

PS. Note to OP: I may be alone in this, but whenever someone puts op a
mockup for viewing by others, I very much prefer to see all the applied
style coded inline. Switching back and forth between a css sheet and the
html file is a drag. In a prod environment, of course, things are different.
Apr 5 '06 #8
Schraalhans Keukenmeester wrote:
PS. Note to OP: I may be alone in this, but whenever someone puts op a
mockup for viewing by others, I very much prefer to see all the
applied style coded inline. Switching back and forth between a css
sheet and the html file is a drag. In a prod environment, of course,
things are different.


Add the Web Developer Toolbar to Firefox. Then you can look at all the
CSS in another pane (Ctrl-Shift-E), and even play with it, no matter if
it is in the document or an external file.

http://chrispederick.com/work/webdeveloper/

Lots of other neat stuff as well.

--
-bts
-Warning: I brake for lawn deer
Apr 5 '06 #9
To further the education of mankind, Schraalhans Keukenmeester
<sc***********************@geenmail.com> declaimed:

<snip>
PS. Note to OP: I may be alone in this, but whenever someone puts op a
mockup for viewing by others, I very much prefer to see all the
applied style coded inline. Switching back and forth between a css
sheet and the html file is a drag. In a prod environment, of course,
things are different.


Nope, not alone. I quite agree with you. I'll even go so far as to say
I'd look at more problem pages if the css was included in the head section
thereof.

--
Neredbojias
Infinity can have limits.
Apr 5 '06 #10
To further the education of mankind, "Beauregard T. Shagnasty"
<a.*********@example.invalid> declaimed:
Schraalhans Keukenmeester wrote:
PS. Note to OP: I may be alone in this, but whenever someone puts op a
mockup for viewing by others, I very much prefer to see all the
applied style coded inline. Switching back and forth between a css
sheet and the html file is a drag. In a prod environment, of course,
things are different.


Add the Web Developer Toolbar to Firefox. Then you can look at all the
CSS in another pane (Ctrl-Shift-E), and even play with it, no matter if
it is in the document or an external file.

http://chrispederick.com/work/webdeveloper/

Lots of other neat stuff as well.


If I install this and decide I don't like it (unlikely), can I uninstall it
cleanly?

--
Neredbojias
Infinity can have limits.
Apr 5 '06 #11
Beauregard T. Shagnasty wrote:
Schraalhans Keukenmeester wrote:

PS. Note to OP: I may be alone in this, but whenever someone puts op a
mockup for viewing by others, I very much prefer to see all the
applied style coded inline. Switching back and forth between a css
sheet and the html file is a drag. In a prod environment, of course,
things are different.

Add the Web Developer Toolbar to Firefox. Then you can look at all the
CSS in another pane (Ctrl-Shift-E), and even play with it, no matter if
it is in the document or an external file.

http://chrispederick.com/work/webdeveloper/

Lots of other neat stuff as well.

Thanks for the link! Time and time again I write additions to my
contributions here I hesitate putting in at creation time fearing they
frustrate people, only to find afterwards it leads to the better tips
here. Usenet, one's gotta love it!

I'll definitely give this one a looksee, although I still stand on my
point. He/she who seeks help should be willing to put in some extra
effort to help people help them, not the other way around. Not that I
refuse to help without their efforts, but like Neredbojias states, I
notice I am willing to spend more time on an issue well-presented with
ease-of-use for the helper in mind. Only human!

Anyway, I'm wandering off-topic, so 'nuf said.
KR

Sh.

Apr 5 '06 #12
Neredbojias wrote:
To further the education of mankind, "Beauregard T. Shagnasty"
<a.*********@example.invalid> declaimed:
http://chrispederick.com/work/webdeveloper/


If I install this and decide I don't like it


Trust me, you'll like it. :) You'll probably wonder how you ever managed
without it.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 5 '06 #13
Neredbojias wrote:
http://chrispederick.com/work/webdeveloper/


If I install this and decide I don't like it (unlikely), can I uninstall it
cleanly?


Tools > Extensions
Select it and click the Uninstall button.

However, you will like it.

--
-bts
-Warning: I brake for lawn deer
Apr 5 '06 #14
Neredbojias wrote:
To further the education of mankind, Schraalhans Keukenmeester
<sc***********************@geenmail.com> declaimed:
I very much prefer to see all the
applied style coded inline. Switching back and forth between a css
sheet and the html file is a drag.

Inline styles don't work very well when dealing with the cascade part of
CSS. Besides, reproducing the production environment as closely as
possible is usually much better for debugging.
I'd look at more problem pages if the css was included in the head section
thereof.


Hmmm... I find it so much easier to have side-by-side windows, one of
the HTML source, and another of the CSS. Scrolling back and forth is a
big PITA. A big monitor comes in handy, for sure. ;)

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.
Apr 5 '06 #15
On Wed, 5 Apr 2006, kchayka wrote:
Hmmm... I find it so much easier to have side-by-side windows, one
of the HTML source, and another of the CSS. Scrolling back and forth
is a big PITA. A big monitor comes in handy, for sure. ;)


Can I put in the routine good word for Pederick's Web Developer
toolbar (for Mozilla etc.), which (in conjunction with the DOM
Inspector) enables you to pick something in the rendered window, and
get told which CSS properties are applying to it.
Apr 5 '06 #16
To further the education of mankind, "Beauregard T. Shagnasty"
<a.*********@example.invalid> declaimed:
Neredbojias wrote:
http://chrispederick.com/work/webdeveloper/
If I install this and decide I don't like it (unlikely), can I
uninstall it cleanly?


Tools > Extensions
Select it and click the Uninstall button.


Hehe, now I _really_ feel dumb...
However, you will like it.


Will install it anon. Thanks. (I've heard nothing but good things about
this extension.)

--
Neredbojias
Infinity can have limits.
Apr 5 '06 #17
To further the education of mankind, kchayka <us****@c-net.us> declaimed:
Neredbojias wrote:
To further the education of mankind, "Beauregard T. Shagnasty"
<a.*********@example.invalid> declaimed:
http://chrispederick.com/work/webdeveloper/


If I install this and decide I don't like it


Trust me, you'll like it. :) You'll probably wonder how you ever managed
without it.


That is what I'm hoping and thanks for the imput.

--
Neredbojias
Infinity can have limits.
Apr 5 '06 #18
To further the education of mankind, kchayka <us****@c-net.us>
declaimed:
Neredbojias wrote:
To further the education of mankind, Schraalhans Keukenmeester
<sc***********************@geenmail.com> declaimed:
I very much prefer to see all the applied style coded inline.
Switching back and forth between a css sheet and the html file is a
drag.

Inline styles don't work very well when dealing with the cascade part
of CSS.


Agreed. I don't recommend them and don't use them myself except for an
occasional oddball reason.
Besides, reproducing the production environment as closely as
possible is usually much better for debugging. I'd look at more
problem pages if the css was included in the head
section thereof.

Hmmm... I find it so much easier to have side-by-side windows, one of
the HTML source, and another of the CSS. Scrolling back and forth is a
big PITA. A big monitor comes in handy, for sure. ;)


Well, when I install the web developer toolbar, we'll see. (Definitely
agree on the scrolling part.)

--
Neredbojias
Infinity can have limits.
Apr 5 '06 #19

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

8
by: Dan | last post by:
When a user clicks on a link in my menu, I want the background color of the link that comes up in the hover to remain on the destination page. My menu looks like this: <div id="adminmenu"> <a...
3
by: PhilG | last post by:
I will try and explain myself as best as I can. First of all I will include the source code and try and explain what I am trying to achieve. **Source start** <style> a:hover { display: block;...
2
by: Sugapablo | last post by:
Can anyone help me out with some code to change three table cells (<td>) when one is hovered over? I have a calendar grid where each day is made up of three table cells and I want all three to...
1
by: Jon W | last post by:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"> <html> <head> <title>rolly</title> <!-- The desired performance for this gem would be to: 1. click on table cells 2. edit in INPUT 3....
0
by: Jon W | last post by:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"> <html> <head> <title>rolly</title> <!-- The desired performance for this gem would be to: 1. click on table cells 2. edit in INPUT 3....
3
by: Yeah | last post by:
Through CSS, is there a way to change the color of a table cell on a hover? By the way, the cell also contains a link - the text link and table cell mouseover should both be clickable to the link's...
2
by: skipc | last post by:
I posted a recent message regarding navigating a table using arrow keys. I've got the code for the navigation working. My table contains rows of links (anchors). I can get to a specific link...
13
by: Gary | last post by:
I have a table with a form consisting of several checkboxes and I'm wondering if its possible to change the table row background color on mouseover or hover and make it stay that color when the...
1
by: darkzone | last post by:
Hi I saw this layout and wanted to try some thing similar, but I am unable to change the position of the vertical menu with out changing the position of the hole document and I don't really have a...
2
by: truezplaya | last post by:
Hey all Just breaking in to some asp.net so sorry if this is a silly question i have an asp:table with asp:tablerows and asp:table cells. When i hover over my links only the links are...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: ryjfgjl | last post by:
ExcelToDatabase: batch import excel into database automatically...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
1
by: CloudSolutions | last post by:
Introduction: For many beginners and individual users, requiring a credit card and email registration may pose a barrier when starting to use cloud servers. However, some cloud server providers now...
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome former...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.