471,049 Members | 1,590 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,049 software developers and data experts.

How do you change button image?

I have CSS for button like

input[type="button"] {
background-image: url(imageFile.gif);
background-repeat: no-repeat;
background-position: right center;
border-width: 0;
border-spacing: 0; padding: 0;
border-collapse: separate;
width: 15;
background-color: cyan;

and HTML

<input type="button" onClick="changeImage(this)">

and JavaScript

var newImage = new Image();
newImage.src = "newimageFile.gif";

function changeImage(thisbutton) {
thisbutton.style.xxxx = arrow_down.src;
My question is what will be for xxxx?

I try
..style.background-image for xxxx, but Netscape/Firefox and IE dosen't
like that.

..style.background is for the background-color, not for background-image.
May 17 '06 #1
2 4984
thisbutton.style.backgroundImage = arrow_down.src;

May 17 '06 #2
ma**********@gmail.com writes:
thisbutton.style.backgroundImage = arrow_down.src;

I'm not sure what you are replying to (please quote enough of the
previous message to give your answer a context), but I'm guessing
that the arrow_down variable points to an Image element, and then
the answer is slightly incorrect.

A pure URL is not a valid value for the CSS background-image property.
Instead, it should be wrapped in "url(...)" and probably quoted too.
So, at least:
thisbutton.style.backgroundImage = 'url("' + arrow_down.src + '")';

Good luck
Lasse Reichstein Nielsen - lr*@hotpop.com
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'
May 18 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

2 posts views Thread by Ben | last post: by
2 posts views Thread by Mark Kamoski | last post: by
6 posts views Thread by ruca | last post: by
4 posts views Thread by Shapper | last post: by
1 post views Thread by Phil_Cam | last post: by
5 posts views Thread by cssExp | last post: by
4 posts views Thread by Peter | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.