# Javascript Rolloverimage and Clickimage

**URL:** <https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449>\
**Category:** programming\
**Created:** [June 4, 2003, 9:19am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449 "2003-06-04T09:19:05Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![peewy](https://avatars.discourse-cdn.com/v4/letter/p/dec6dc/32.png) [@peewy](https://forum.kirupa.com/u/peewy)\
**Post date:** [June 4, 2003, 9:19am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/1 "2003-06-04T09:19:05Z")

</div>

Hi all,  
About javascripting, I made a website with buttons.  
When you roll over the buttons they change from colour.  
Head  
SCRIPT LANGUAGE=“JavaScript”

!-- Begin

```
home= new Image();
home.src = "images2/home_over.jpg";

```

// End –  
/script  
Body  
a href="home.htm"onmouseover=“home.src=‘images2/home\_over.jpg’;” onmouseout=“home.src=‘images2/home.jpg’;”  
img name=“home” src=“images2/home.jpg” border=0 width=“51” height=“66” /a

This is working well with more buttons, I just have to repeat the code, but I want to go further, if you click on a button it should stay in his rollovercolour (red).  
So they see they are at the home-section, if they click a new button like contact, the home button should return in his normal state and normal colour. And the contactbutton should change in the rollovercolour.

I think it has to be done with a onClick function or something and then keep it in a kind of memory.

I’m hoping that someones knows the solution :ub:  
thx allready

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 4, 2003, 9:58pm UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/2 "2003-06-04T21:58:07Z")

</div>

If your buttons and content are all in the same page, then you can’t do that because your page changes therefore all the buttons will return to their original state when the new page loads. If you are using frames and the page that contains your buttons does not change, then you would use an onClick, but a function would have to be created to perform the action correctly.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 5, 2003, 1:42am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/3 "2003-06-05T01:42:18Z")

</div>

Oh BTW: If all your items are on 1 page, then simple change the image that shows for the button which the page corresponds (so if you have a button that says “about” then on the about page change the default image of that button)

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 5, 2003, 5:23am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/4 "2003-06-05T05:23:52Z")

</div>

Thank you for replying, lost in beta 🙂

I’m using frames in my htmlpage, here is the url from the website:

[http://users.skynet.be/peewy/studiofx2](http://users.skynet.be/peewy/studiofx2)

This will be more clear.  
As you can see on the top frame, there are this rollover buttons.  
If you click on a button, the middle frame changes, for example I clicked services, so this button should stay red, they know where they are then.  
I want to create an easy navigation throughout my webpage.

I think an Onclickfunction should be possible then, because i’m using this frames.

Now I just need someone, who knows how to write this code or a tutorial website.

Sorry for trouble 🙂 many thanks allready

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 6, 2003, 5:04am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/5 "2003-06-06T05:04:24Z")

</div>

Is someone able to write this javascript for me?

Greets me Ⓜ

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 6, 2003, 5:29am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/6 "2003-06-06T05:29:08Z")

</div>

It’s a lot to ask for, I don’t have time to work on something like that now. Sorry.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [June 6, 2003, 10:53am UTC](https://forum.kirupa.com/t/javascript-rolloverimage-and-clickimage/22449/7 "2003-06-06T10:53:58Z")

</div>

Ah 'k 🙂 if you ever found the solution, just let me know.

Many Many Many thanks :thumb:

And if you found it, maybe it can come on the tutorialwebpage of Kirupa, frontpage code. It would be an unic and new tutorial.

Just idea’s hé…

Even I will continue my search for the script and if I found it, I’ll mail it to you. If ok.

Greetz (-:
