Tom's Guide | Tom's Hardware | Tom's Games
 |
 |
 |
Hi,
I'm beginner for javascript programming.
I'm trying to do change the color of the image(Rectangle) by prompting user to enter the color.
I have written following:
function changeColor(){
var temp=" ";
temp = prompt("Enter the color to change color of the rectangle:","Enter color");
shapecolor = temp;
[document.getElementByTagName("img").style.color = shapecolor;]}
And in body part I've written following:
<body onLoad="preload();">
<form name="form1"><table width="60%" align="left">
<tr>
<td width="40%" align="left" valian="left"><input TYPE="BUTTON" VALUE="Change color" onClick="changeColor();"></p>
</td>
</tr>
</table>
</form>
</body>
</html>
This won't work, it gives me error on line between the brackets:
Object doesn't support this property or method!Any help will be greatly appreciated.
thanks.
Priti-
Some of your post got swallowed by the parsing, but I think we get the general idea.A couple of things:
1. You're trying to change the color of an image with javascript? This probably isn't the best way to go about this. A better bet is to make a DIV, TD, SPAN, etc. and just change its background color.2. getElementByTagName(el) is probably inferior to getElementById(el), because the ID one you can have more than one of that kind of element and still know exactly which one you're accessing
3. valian should be valign
4. Why do you initialize "temp" to be a space? In javascript it's not necessary to declare temp at all, but it's probably good practice so you are in the habit in other languages.
I think that was all I saw. The following worked:
<HTML>
<HEAD>
<TITLE>test</TITLE>
<SCRIPT language="javascript">
function changeColor(){
var temp=" ";
temp = prompt("Enter the color to change color of the
rectangle:","blue");
document.getElementById("myDIV").style.backgroundColor
= temp;
}
</SCRIPT>
<STYLE>
div.rect {
height: 100px;
width: 100px;
background-color: red;
}
</STYLE>
</HEAD>
<body">
<form name="form1">
<table width="60%" align="left">
<tr>
<td width="40%" align="left" valign="left">
<DIV class="rect" ID="myDIV"></DIV>
<input TYPE="BUTTON" VALUE="Change color" onClick="changeColor();">
</td>
</tr>
</table>
</form>
</body>
</html>Hope this helps,
-SN
0 
 |
 |
 |
This post is quite old and has been locked from receiving new replies. Please create a new posting instead.
| Ads by Google |
