Random Colour
anyone know how to make the colour text box w2 change to a random colour when button clicked please ?
</html>
<FORM NAME = frmOne>
StartA X: <INPUT TYPE = Text NAME = x SIZE = 5 value ="0">
Two B Y: <INPUT TYPE = Text NAME = y SIZE = 5 value ="1">
Three D W: <INPUT TYPE = Text NAME = w SIZE = 5 value ="0">
W2+: <INPUT TYPE = Text NAME = w2 style="background-color:#444999" SIZE = 5 value = ("0") >
W3:<INPUT TYPE = Text NAME = w3 SIZE = 5 value = "0" >
<P>
Total Z: <INPUT TYPE = Text NAME = z SIZE = 5 value = "0">
<P>
<p>
<Input Type = Button NAME = b1 VALUE = "Pluss One" onClick = calculate(),colourchange() >
</FORM>
<SCRIPT language = JavaScript>
function calculate()
{
var randomnumber=Math.floor(Math.random()*99)
A = document.frmOne.x.value
B = document.frmOne.y.value
D = document.frmOne.w. value
A = Number(A)
B = Number(B)
D = Number(D)
C = (A + B)
D = (D + 1)
E = randomnumber
document.frmOne.z.value = C
document.frmOne.x.value = B
document.frmOne.w.value = D
document.frmOne.w2.value = E
document.frmOne.y.value = A+1
document.frmOne.w3.value = A+B+C+D+E
}
</SCRIPT>
<SCRIPT language = JavaScript>
function colourchange()
{
var randomnumber2=Math.floor(Math.random()*999999)
if
B > 1
then w2= "background-color:#randomnumber2"
else
w2= "background-color:#987654"
}
</SCRIPT>
Kniggles
Junior Poster in Training
57 posts since Oct 2010
Reputation Points: 10
Solved Threads: 0
</html>
<FORM NAME = frmOne>
W2+: <INPUT TYPE = Text NAME = w style="background-color:#654321;" SIZE = 5 value = "0" >
<P>
Total Z: <INPUT TYPE = Text NAME = z SIZE = 5 value = "1">
<P>
<p>
<Input Type = Button NAME = b1 VALUE = "Pluss One" onClick = calculate() colourchange() >
</FORM>
<SCRIPT language = JavaScript>
function calculate()
{
A = document.frmOne.w. value
A = Number(A)
C = A+1
document.frmOne.w.value = C
document.frmOne.z.value = C+1
}
</SCRIPT> ///////////////// this bits not working
<SCRIPT language = JavaScript>
function colourchange()
$random = var randomnumber2=Math.floor(Math.random()*999999)
{
document.frmOne.w.style="background-color:#($random);"
}
</SCRIPT>
Kniggles
Junior Poster in Training
57 posts since Oct 2010
Reputation Points: 10
Solved Threads: 0
</html>
<FORM NAME = frmOne>
W2+: <INPUT TYPE = Text NAME = w style="background-color:#123456;" SIZE = 5 value = "0" >
<P>
Total Z: <INPUT TYPE = Text NAME = z SIZE = 5 value = "1">
<P>
<Input Type = Button NAME = b1 VALUE = "Pluss One" onClick = calculate() colourchange() >
</FORM>
<SCRIPT language = JavaScript>
function calculate()
{
A = document.frmOne.w. value
A = Number(A)
C = A+1
document.frmOne.w.value = C
document.frmOne.z.value = C+1
}
function colourchange()
{
var RandomDotColor = Math.round(Math.random() * 0xFFFFFF);
document.frmOne.w.style = "background-color:(RandomDotColor);"
}
</SCRIPT>
still wont change colour
Kniggles
Junior Poster in Training
57 posts since Oct 2010
Reputation Points: 10
Solved Threads: 0
- Attach a click listener to the button.
- When the button is clicked, generate 3 random numbers between 0 and 255.
- Set the backgroundColor property to use the rgb() colour system with those 3 numbers representing Red, Green, Blue:
element.style.backgroundColor = "rgb("+randomRed+","+randomGreen+","+randomBlue+")";
is this along the right lines please?
</html>
<FORM NAME = frmOne>
W2+: <INPUT TYPE = Text NAME = w style="background-color:#123456;" SIZE = 5 value = "0" >
<P>
Total Z: <INPUT TYPE = Text NAME = z SIZE = 5 value = "1">
<P>
<Input Type = Button NAME = b1 VALUE = "Pluss One" onClick = calculate() colourchange() >
</FORM>
<SCRIPT language = JavaScript>
function calculate()
{
A = document.frmOne.w. value
A = Number(A)
C = A+1
document.frmOne.w.value = C
document.frmOne.z.value = C+1
}
</SCRIPT>
<SCRIPT language = JavaScript>
function colourchange()
{
var red=Math.floor(Math.random()*256)
var green=Math.floor(Math.random()*256)
var blue=Math.floor(Math.random()*256)
w.style.backgroundColor = "rgb("+randomRed+","+randomGreen+","+randomBlue+")";
}
</SCRIPT>
`its not working yet though .
`1. click listiner = fuction ?
`2. var blue=Math.floor(Math.random()*256) = var # < 256 = check yes 2 s64 no = donot pass GO.
3. dos element = name ?
4. have I put it in the right place ?
Kniggles
Junior Poster in Training
57 posts since Oct 2010
Reputation Points: 10
Solved Threads: 0
Your codes are non-standard and wrong syntax. You can't call two function with only one click event.
And also the variable are not matching (randomRed,randomGreen,randomBlue), I don't see these three variable defined. It must be (red,green,blue).
Try with below:
<html>
<body>
<form name="frmOne">
W2+: <input type="text" name="w" style="background-color:#123456;" size="5" value="0" />
<p>
Total Z: <input type="text" name="z" size="5" value="1" /></p>
<p>
<input type="button" name="b1" value="Pluss One" onClick="calculate()" /></p>
</form>
<script language="javascript" type="text/javascript">
function calculate()
{
A = document.frmOne.w.value;
A = Number(A);
C = A+1;
document.frmOne.w.value = C;
document.frmOne.z.value = C+1;
return colourchange();
}
</script>
<script language="javascript" type="text/javascript">
function colourchange()
{
var red=Math.floor(Math.random()*256)
var green=Math.floor(Math.random()*256)
var blue=Math.floor(Math.random()*256)
document.frmOne.w.style.backgroundColor = "rgb("+red+","+green+","+blue+")";
}
</SCRIPT>
</body>
</html>
It should work. Hope this help!
Zero13
Practically a Master Poster
624 posts since Jan 2009
Reputation Points: 120
Solved Threads: 139