Hallo Leute.
Ich hab mal wieder nen kleines Problem Ich bin gerade dabei ein kleines Bewertungssystem in mein Gästebuchscript zu integrieren. Da ich aber noch ganz wenig ahnung von Javascript habe, bin ich gerade ein bisschen am verzweifeln, bei meinem Problem
Also das Script soll ganz einfach nur 5 Sterne anzeigen und wenn man mit der Maus drüber geht, soll sich die Sternereihe soweit Füllen, wie die Maus geht. Klappen tut es soweit schon, nur leider ist ein kleines Problem da. Es sind aufeinmal 2 Sternereihen.
Ich schreib einfachmal den Code hierhin...
Ich hab mal wieder nen kleines Problem Ich bin gerade dabei ein kleines Bewertungssystem in mein Gästebuchscript zu integrieren. Da ich aber noch ganz wenig ahnung von Javascript habe, bin ich gerade ein bisschen am verzweifeln, bei meinem Problem
Also das Script soll ganz einfach nur 5 Sterne anzeigen und wenn man mit der Maus drüber geht, soll sich die Sternereihe soweit Füllen, wie die Maus geht. Klappen tut es soweit schon, nur leider ist ein kleines Problem da. Es sind aufeinmal 2 Sternereihen.
Ich schreib einfachmal den Code hierhin...
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>5 Stars</title>
<style>
.null{
border-style:none;
background-color:transparent;
background-image:url(null.png);
background-repeat:no-repeat;
color:transparent;
}
.eins {
border-style:none;
background-color:transparent;
background-color:transparent;
background-image:url(eins.png);
background-repeat:no-repeat;
color:transparent;
}
</style>
<script type="text/javascript">
var cs = 4;
function Input(id){
document.getElementById('Bewertung').innerHTML = '<form method="post">';
for(var i = 1; i <= 5; i++){
if(i <= id){
document.getElementById('Bewertung').innerHTML += '<input type="submit" id="'+i+'" onmouseover="Input('+i+');" class="eins" value="'+i+'" />';
}else{
document.getElementById('Bewertung').innerHTML += '<input type="submit" id="'+i+'" onmouseover="Input('+i+');" class="null" value="'+i+'" />';
}
}
document.getElementById('Bewertung').innerHTML += '</form>';
}
</script>
</head>
<body>
<p id="Bewertung">
<form method="post">
<script type="text/javascript">
for(var a = 1; a <= 5; a++){
if(a <= cs){
document.write('<input type="submit" id="'+a+'" onmouseover="Input('+a+');" class="eins" value="'+a+'" />');
}else{
document.write('<input type="submit" id="'+a+'" onmouseover="Input('+a+');" class="null" value="'+a+'" />');
}
}
</script>
</form>
</p>
</body>
</html>