how can I call a function from an image?

[wlandymore]

I have a simple calculator form I've been working on and it works great with the generic <input type=button>, but I want to put an image there and have that act as the button.
However, when I switch the type=button to type=image, the onClick="adCalc(this.form)" I have on that button no longer works.

Does anyone know how I can call this function from within the form by using an image as the button?

[birdbrain]

Hi wlandymore,

the trick is to use...

<input type="button"..........

...and then style it with css. Here is an example for you to try...
<style type="text/css">
<!--
#button {
width:100px;
height:100px;
background-image:url(http://achelous.mysite.wanadoo-members.co.uk/anim3.gif);
font-family:verdana,sans-serif;
font-size:18px;
color:#f00;
}
-->
</style>

<input id="button" type="button" onclick="adCalc(this.form)" value="button">

[wlandymore]

I put it in there and it wouldn't work.

I tried a local file, one with a full reference to a location on the web....both just showed the generic button from the input.

The style sheet is working because it resized it to what I had set. It's just the background setting that isn't working.....

Here's a temporary location with the html page so you can see what I'm talking about...

page (http://www.rebekahhiggs.com/images/page.html)

[birdbrain]

Hi wlandymore,

I am a little confused. :confused:

What, exactly, is it that is not working. :supereek:

if as you say...
I have a simple calculator form I've been working on and it works great with the generic <input type=button>
...then styling this button with css can not effect it's performance in any way. :)

[wlandymore]

well it's working as it is, but I don't have the image on the buttons.
If I try to apply the image in another way, say:

<input type="image" src="calc.gif" onclick="adCalc(this.form)" value="">

Then it can't tell that I want things from the form and it won't do anything.

The program still works with the style, it just won't display the image (which is what I wanted)

[birdbrain]

Hi wlandymore,

I see this image...

http://www.rebekahhiggs.com/images/calc.gif

...as the background-image of your buttons, when viewing your page in these browsers...

Firefox 1.0.4
IE 6.0.2
Mozilla 1.7
Netscape 8.04
Opera 8.5

[wlandymore]

okay, I can see it in FireFox, but it's not showing up in IE....

I have version: 6.0.2900.2180

I have images and everything enabled, but I got someone else to try it and they can see it with IE too. There's something messed about my browser that won't let me see that image.

[wlandymore]

okay....finally got it.

IE was caching the page so it was just bringing up the old one.
I cleared the cache and now I can see it too....


thanks.

[birdbrain]

Hi wlandymore,

try clearing out your Temporary Internet Files...

Open IE
Click the 'Tools' tab
Click 'Internet Options'
Under 'Temporary Internet Files' click 'Delete Files'
In the 'Dialog box' check 'Delete all offline content'
Click 'OK'
Click 'OK'

...see if that helps. :)

Reason for edit:- you knew how to do this then. :D

[wlandymore]

yup. :D

thanks for all the help though...