JavaScript image handler

Question

I am using this JavaScript function in order to change image on click, but it is doing refresh all the time and go back to the original image.

this is the code I am using;

function showImage1() {; 
    document.getElementById('Image5').style.visibility = 'visible';
    document.getElementById('Img1').style.visibility = 'hidden';
}

<div>
    <input ID="Button1" type="image" src=" Resources/Icons/benefitBtn.png" OnClick="showImage1();"/>
</div>

Any suggestion please?

There is no jQuery in your example. I edited the title, question, and tags to reflect that. — Colin Brock
– Colin Brock, Commented Mar 23, 2012 at 15:56
Can you clarify your question? What does "doing refresh all the time and go back to the original image" mean? — Nicholas Head
– Nicholas Head, Commented Mar 23, 2012 at 15:57

ianbailey · Accepted Answer · 2012-03-23 15:59:14Z

2

<input ID="Button1" type="image" src="Resources/Icons/benefitBtn.png" onClick="showImage1();return false;"/>

Adding return false should stop any submit nature. If I understood correctly.... :)

answered Mar 23, 2012 at 15:59

ianbailey

6305 silver badges14 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

dmc · Accepted Answer · 2012-03-23 16:04:02Z

0

Try this:

 function toggleImage(elementToShow,elementToHide){
    $("#" + elementToShow).show();
    $("#" + elementToHide).hide();
 }

 <div>
 <input ID="Button1" type="button" class="yourButtonClass" OnClick="showImage1('Image5','Img1');"/>
 </div>

 set your button's background image in your stylesheet.

answered Mar 23, 2012 at 16:04

dmc

8272 gold badges10 silver badges26 bronze badges

Collectives™ on Stack Overflow

JavaScript image handler

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related