Here what I have (already with the help of this forum):
Code:
<body>
<script type="text/javascript">
function showAnswer() {
document.getElementById('answer').style.color = '#000'; //#000 is black
}
function hideAnswer() {
document.getElementById('answer').style.color = '#FFF'; //#FFF is white
}
</script>
<div id="question" onclick="showAnswer()"><span style="color:blue">Where is Los Angeles? (Click the question to show the answer)</span></div>
<div id="answer" style="color:#FFF">in california<br /></div>
<a href="javascript://" onclick="hideAnswer()">Review Later</a>
</body>
The question is in blue color. When clicked I would like that it changes to green color. If clicked on "review later" I would like that the question turns to red color . I don't know how to combine all this. Someone can help me? I think I have to add the following coding, but can't combine the script:
Code:
<script type="text/javascript">
function showAnswer() {
document.getElementById('question').style.color = '#006600';//#006600 is green
}
function hideAnswer() {
document.getElementById('question').style.color = '#FF0000';//#FF0000 is red
}
</script>
<body>
<script type="text/javascript">
function Answer(id,col) {
document.getElementById(id).style.color = col;
}
</script>
<div id="question" onclick="Answer('answer','#000')"><span style="color:blue">Where is Los Angeles? (Click the question to show the answer)</span></div>
<div id="answer" style="color:#FFF">in california<br /></div>
<a href="javascript://" onclick="Answer('answer','green')">Review Later</a>
</body>
<body>
<script type="text/javascript">
function Answer(id,col) {
document.getElementById(id).style.color = col;
}
</script>
<div id="question" onclick="Answer('answer','#000')" ><span style="color:blue">Where is Los Angeles? (Click the question to show the answer)</span></div>
<div id="answer" style="color:#FFF">in california<br /></div>
<a href="javascript://" onclick="Answer('answer','white')">Review Later</a>
</body>
I want to make an improvement.
Imagine having 100 questions to answer. When I click on one question I get the answer ( the answer turns from white to black ) and the question turns to green color, which means that I have answered to the question. If I decide to repeat the question later, I click on review later, the question turns to red color and the answer to white, so that I can't see the answer.
<body>
<script type="text/javascript">
function Answer() {
var args=Answer.arguments;
for (var z0=0;z0<args.length;z0+=2){
document.getElementById(args[z0]).style.color = args[z0+1];
}
}
</script>
<div id="question" onclick="Answer('answer','#000','question','green')" style="color:blue" ><span >Where is Los Angeles? (Click the question to show the answer)</span></div>
<div id="answer" style="color:#FFF">in california<br /></div>
<a href="javascript:Answer('answer','white','question','red');" >Review Later</a>
</body>
Dear vwphillips thank you very much, the script, with a few changes (see below), is working fine.
In the meantime I got an idea; Instead of clicking on "R" for reviewing the question later, is it possible to change the script so that if clicked on the question a second time it (the question) turns to red color and the answer disappear?
Again, many many thanks for your help.
Code:
<body>
<script type="text/javascript">
function Answer() {
var args=Answer.arguments;
for (var z0=0;z0<args.length;z0+=2){
document.getElementById(args[z0]).style.color = args[z0+1];
}
}
</script>
R stands for review later</p>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="2%"><a href="javascript://" onclick="Answer('answer1','white','question1','red');" >R</a></td>
<td width="98%"><div id="question1" onclick="Answer('answer1','#000','question1','green')" style="color:blue" ><span >Where is Los Angeles? </span></div></td>
</tr>
</table>
<div id="answer1" style="color:#FFF">in california</div>
<table width="100%" cellspacing="0" cellpadding="0">
<tr>
<td width="2%"><a href="javascript://" onclick="Answer('answer2','white','question2','red');" >R</a></td>
<td width="98%"><div id="question2" onclick="Answer('answer2','#000','question2','green')" style="color:blue" ><span >Where is Bern? </span> </div></td>
</tr>
</table>
<div id="answer2" style="color:#FFF"> in switzerland</div>
</body>
Reply With Quote
Bookmarks