<html>
<head>
<title> Die Rolls </title>
<script type="text/javascript" src="http://balance3e.com/random.js">
</script>
<script type="text/javascript">
function RollDice()
// Assumes: die images are in http://balance3e.com/Images
// Results: displays 2 random die rolls & keeps a count in rollSpan
{
var roll1, roll2;
roll1 = RandomInt(1, 6);
roll2 = RandomInt(1, 6);
document.getElementById('die1Img').src =
'http://balance3e.com/Images/die' + roll1 + '.gif';
document.getElementById('die2Img').src =
'http://balance3e.com/Images/die' + roll2 + '.gif';
document.getElementById('rollSpan').innerHTML=
parseFloat(document.getElementById('rollSpan').innerHTML) + 1;
if (roll1==roll2) {document.getElementById('doubleSpan').innerHTML=
parseFloat(document.getElementById('doubleSpan').innerHTML) + 1;
}
}
</script>
</head>
<body>
<div style="text-align:center">
<p>
<img id="die1Img" alt="die image"
src="http://balance3e.com/Images/die1.gif">
<img id="die2Img" alt="die image"
src="http://balance3e.com/Images/die1.gif">
</p>
<input type="button" value="Click to Roll" onclick="RollDice();">
<hr>
<p>
Number of rolls: <span id="rollSpan">0</span>
Number of doubles: <span id="doubleSpan">0</span>
</p>
</div>
</body>
</html>
This code works perfectly except im looking for a way to reset the counter variables back to zero without reloading the page what would be the best way to go about this I have looked through some books and tried searching the web but havent found anything Its probally something extremly simple im just not thinking about.

New Topic/Question
Reply


MultiQuote




|