Indexhibit Support

Hi,

I need help setting up a rollover logo in the pre-nav of my website. I have tried several ways including following the directions here indexhibit.org/forum/thread/8521/, but can't make anything work. I am using version 2, so I imagine that is the problem. Does anyone have a way of making a rollover logo work in version 2?

Thanks,

Ramsay

BTW, Here is my website: ramsaypalmer.com

The rollover I am trying to create is on the logo in the upper left hand corner. I want the logo to change from yellow to dark grey.

Thank you,

Ramsay

Apparently the code in that post is a bit messed up so I'm reposting it:

In this case I have an button that is 100px X 100px and the image is 100px X 200px that has both states (normal and hover) on top of each other
(check out this thread to understand more about image structure etc)

The css:

1. a.rolloverme {
2.     display: block; 
3.     width: 100px; 
4.     height: 100px; /* make a box with a set width and height... */
5.     text-decoration: none;
6.     background: url('YOUR_IMAGE_URL'); /* ...and set it's background */
7.     }
8. a.rolloverme:hover {
9.     background: url('YOUR_IMAGE_URL') 0 100px; /* this creates the magic - moves the background image inside the box down by 100px so the HOVER button appears */
10.     }
11. .hidethis {
12.     display: none; /* you need this */
13.     }
14.     

then just simply add

1. <a href="A_URL" class="rolloverme"><span class="hidethis">This is a button</span></a>

You need the .hidethis css rule to make things semantically right (screen readers and search engines will know that this is a button)

If you get the hang of this you can extend it for :visited and :active states as well...
And of course you can create different sets of the css code above for different buttons (rolloverme1, rolloverme2 etc)...

Thank you so much, arsondpi. It worked like a charm.