Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 15.08.2013, 15:52
ferguson ferguson ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 15.08.2013
Beiträge: 1
ferguson befindet sich auf einem aufstrebenden Ast
Idee Drop Down - Liste mit Timer

Hallo Leute,

da ich gerade am Basteln meiner Homepage bin, möchte ich gerne eine Drop Down - Liste mit einen Timer in der HTML <select><option>... implementieren.

Hier die html - Liste:

HTML-Code:
<select name="dropdown">
<option value="Project 1" selected>Project 1</option>
<option value="Project 2" selected>Project 2</option>
<option value="Project 3" selected>Project 3</option>
<option value="Project 4" selected>Project 4</option>
</select>
Mein Ziel ist es wenn man Project 2 wählt, den Timer starten zu lassen. Wenn man wieder auf Project 1 klickt, möchte ich, dass er stehen bleibt.
Der Timer sollte rechts nach Project 1 gezeigt werden (in der Select - Option drin)

Unten findet Ihr den JavaScript - Timer:

HTML-Code:
<html>
<script type="text/javascript">
var count=0,chkfn=null;
function changeColor() 
{    
chkfn = setInterval(starttimer, 1000);
}

function starttimer() 
{    
count += 1;    
var oElem = document.getElementById("divtxt");    
oElem.style.color = oElem.style.color == "red" ? "blue" : "red";    
document.getElementById("pcount").innerHTML = "Zeit: " + count;
}

function stoptimer() 
{    
clearInterval(chkfn);   
chkfn = null;    
count = 0;    
document.getElementById("pcount").innerHTML = '';
}
</script>

<body><div id="divtxt"><p id="pcount" style="font:bold 24px verdana"></p></div>
<button onclick="changeColor();">Start Timer</button>
<button onclick="stoptimer();">Stop Timer</button>
</body>
</html>
Ich weiß leider nicht, wie man das richtig macht. Sollte jemand von euch Vorschläge haben, bitte dann antworten.

mit freundlichen Grüßen,
Mit Zitat antworten
Sponsored Links