Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Mouseover

Posted on 2002-06-21
4
Medium Priority
?
326 Views
Last Modified: 2010-04-09
I have a bunch of cells where I have to do the same mouseover and mouseout events.  Is there a way using style sheets that I can only have my mouseout and over code once.
0
Comment
Question by:curtis591
  • 2
4 Comments
 
LVL 10

Expert Comment

by:dij8
ID: 7099712
If you are applying styles on a mouseover event then yes you can do it in one go.  <td class="classname">stuff</td>

.classname {
  style;
}
.classname:hover {
  different style;
}

This will not work in Netscape.  But a mouseover event will not work in Netscape when used in a <td> tag either.  So I will assume you are coding only for IE anyway.

If you are trying to activate a function then no, styles do not run functions.
0
 
LVL 10

Expert Comment

by:dij8
ID: 7099729
The classname:hover thing doesn't work.  I guess I should have tested first.  You will need a mouseover and mouseout event.  But if you are after a function that comment still stands true.  You can't do it using styles.
0
 
LVL 18

Expert Comment

by:bruno
ID: 7100533
dij8,

that WILL work in the future....at least it should...when the browsers support it....
0
 
LVL 17

Accepted Solution

by:
dorward earned 200 total points
ID: 7100575
Assuming that the mouse over effect is becuase the cells are links:

#myTable a {
  display: block;
  width: 100%;
  height: 100%;
  color: black;
  vertical-align: middle;
  text-align: center;
}

#myTable a:link {
 background-color: #aaa;
}

#myTable a:visited {
 background-color: #faa;
}

#myTable a:hover {
 background-color: #afa;
}

#myTable a:active {
 background-color: #aaf;
}

with:

<table id="myTable">
<tr><td><a href="foo">link</a></td></tr>
<tr><td><a href="foo">link</a></td></tr>
<tr><td><a href="foo">link</a></td></tr>
<tr><td><a href="foo">link</a></td></tr>
</table>

and edit any values to suit your needs.
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to embed an audio file in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: : The declaration should display (CODE) HTML5 is supported by the most recent versions of all major browsers…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

963 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question