Image: MouseOver - MouseOut - OnClick problem

[John]

Imagine this:

I have a gif-image with text, coloured green.
When MouseOver occurs the gif will swap to another gif with red colourded
text. On MouseOut the gif turns back to the green text.

-----------------This is my code:

<a href="nextpage.html" onMouseOver="document.green.src='red.gif'"
onMouseOut="document.green.src='green.gif'">
<img src="green.gif"></a>

-----------------

After clicking this link, I want the image to stay red. How can I manage
this??
Problem is that on MouseOut the image turns green again... :-(

I tried CSS using an transparent gif with backgroundimages, but it still
doesn't work.

Can someone help me out?

John

[Citizen Trout]

Maybe you could look into adapting this ?

[url]http://www.projectseven.com/tutorials/css_menus/list_01/[/url]


John wrote:

> Imagine this:
>
> I have a gif-image with text, coloured green.
> When MouseOver occurs the gif will swap to another gif with red colourded
> text. On MouseOut the gif turns back to the green text.
>
> -----------------This is my code:
>
> <a href="nextpage.html" onMouseOver="document.green.src='red.gif'"
> onMouseOut="document.green.src='green.gif'">
> <img src="green.gif"></a>
>
> -----------------
>
> After clicking this link, I want the image to stay red. How can I manage
> this??
> Problem is that on MouseOut the image turns green again... :-(
>
> I tried CSS using an transparent gif with backgroundimages, but it still
> doesn't work.
>
> Can someone help me out?
>
> John
>
>
>

[Steve Goldfarb]

In <mztUb.10427$%i5.762@news-binary.blueyonder.co.uk> Citizen Trout <nospam@this.com> writes:

>John wrote:

>> Imagine this:
>>
>> I have a gif-image with text, coloured green.
>> When MouseOver occurs the gif will swap to another gif with red colourded
>> text. On MouseOut the gif turns back to the green text.
>> After clicking this link, I want the image to stay red. How can I manage
>> this??
>> Problem is that on MouseOut the image turns green again... :-(
>>
>> I tried CSS using an transparent gif with backgroundimages, but it still
>> doesn't work.

It's not a coding problem, it's a logic problem. You're going to need to
save the state of the button. So you'll need an image called something
like "button_1_postclick" where you set the .src initially to green.gif,
and then have the onMouseOut set the gif to button_1_postclick rather than
to green.gif. Then have your onClick function for button_1 change the .src
of button_1_postclick to red.gif

Or I suppose you could do it with a global variable -- "button_1_clicked"
flag. Then have your onMouseOut check the variable - if not
button_1_clicked then swap gif to green, else leave it red, and have
onMouseOut set button_1_clicked = true.

Hope that helps.

--sg

>>
>> Can someone help me out?
>>
>> John
>>
>>
>>

--
---------------------------------------
Buy my boat!
[url]http://www.oscodagroup.com/boat[/url]