Help with Menu and background images

Hi

I need to do something and I really don't know how to do it. I have a PRMenuWidget and for each menu item I have a particular background image. In those images  I have also the text. For example, in the aboutUs.gif there is also the text "About Us". I want to put another background image for mouse hover (actually it only changes the text color). This works well. The problem is that I want to use this image not only with hover but also when that menu item is selected. When I click on that menu item, I want to put that image.

In html + javascript it should be something like this:

<td colspan="9">

<a onmouseout="window.status=''; changeImages('about_us', 'images/about-us.gif'); return true;" onmouseover="window.status='about us'; changeImages('about_us', 'images/about-us-over.gif'); return true;" href="about.html">

<img width="171" height="40" border="0" alt="about us" src="images/about-us.gif" name="about_us"/>

</a>

</td>

any ideas of how can I do this trough pier/seaside ?

Thanks in advance,

Mariano



_______________________________________________
Magritte, Pier and Related Tools ...
https://www.iam.unibe.ch/mailman/listinfo/smallwiki

Hi Mariano

I have used

   .menu li a.active { background: url(xxxJpg); }

But I have only gotten it to work using a WAFileLibrary setup in the strictly seaside way.
John

On Mon, Apr 13, 2009 at 9:08 PM, Mariano Martinez Peck <[hidden email]> wrote:

Hi

I need to do something and I really don't know how to do it. I have a PRMenuWidget and for each menu item I have a particular background image. In those images  I have also the text. For example, in the aboutUs.gif there is also the text "About Us". I want to put another background image for mouse hover (actually it only changes the text color). This works well. The problem is that I want to use this image not only with hover but also when that menu item is selected. When I click on that menu item, I want to put that image.

In html + javascript it should be something like this:

<td colspan="9">

<a onmouseout="window.status=''; changeImages('about_us', 'images/about-us.gif'); return true;" onmouseover="window.status='about us'; changeImages('about_us', 'images/about-us-over.gif'); return true;" href="about.html">

<img width="171" height="40" border="0" alt="about us" src="images/about-us.gif" name="about_us"/>

</a>

</td>

any ideas of how can I do this trough pier/seaside ?

Thanks in advance,

Mariano

_______________________________________________
Magritte, Pier and Related Tools ...
https://www.iam.unibe.ch/mailman/listinfo/smallwiki

_______________________________________________
Magritte, Pier and Related Tools ...
https://www.iam.unibe.ch/mailman/listinfo/smallwiki