By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
446,267 Members | 1,808 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 446,267 IT Pros & Developers. It's quick & easy.

CSS rollover to change background image

P: n/a
I have the following code:
<style>
#item1
{
DISPLAY: block;
BACKGROUND: url(ProjMenuImgs/ProjBtn.gif) no-repeat 0px 0px;
WIDTH: 87px;
HEIGHT: 94px;
}
#item1:hover { background-position: 0 -92px; }
</style>...<A id="item1" class="toggle" href="#"></A>The ProjBtn has top and
bottom half for the rollover effect. However, I found that if I change
#item1 to 'a' (or assign a class to the a and change it to '.toggle'), e.g:
#item1:hover { background-position: 0 -92px; }to a:hover {
background-position: 0 -92px; }(or .toggle:hover {...},the rollover won't
work. Since I have a lot of Links (each has the top/bottom images) need have
the rollover function. I don't want to give every anchor an ID. Any problem
in my current code? Thanks. Or any better way to implement image toggling
when mouse over?
Jul 20 '05 #1
Share this Question
Share on Google+
1 Reply


P: n/a
nick wrote:
The ProjBtn has
top and bottom half for the rollover effect. However, I found that if
I change #item1 to 'a' (or assign a class to the a and change it to
'.toggle'), e.g: #item1:hover { background-position: 0 -92px; }to
a:hover { background-position: 0 -92px; }(or .toggle:hover {...},the
rollover won't work. Since I have a lot of Links (each has the
top/bottom images) need have the rollover function. I don't want to
give every anchor an ID. Any problem in my current code? Thanks. Or
any better way to implement image toggling when mouse over?


I don't really understand what you mean. I do it like this:
http://www.nrkn.com/cssRollover/
Jul 20 '05 #2

This discussion thread is closed

Replies have been disabled for this discussion.