Ich mache ein Projekt in CodeIgniter und ich habe ein Formular, das verwendet wird, um ein Produkt zu bewerten.wie das ganze Sternsymbol zu färben, wenn die Schaltfläche geklickt wird
Wenn ich auf eine Schaltfläche geklickt (Stern) Ich brauche die ganze Taste (Stern), um seine
Farbe zu ändern in yellow.I dies tat, aber es ändert sich nur die Rahmenfarbe in yellow.Middle
der Schaltfläche bleibt in weiß. kann mir bitte jemand erklären, wie man das macht?
<h1><div class="rating" style="width:200px;float:left;padding-left:1px">
<span id="span1" onclick="document.getElementById
('rateText').innerHTML='Excellent', setColor(this.id);"> ? </span>
<span id="span2" onclick="document.getElementById
('rateText').innerHTML='Good', setColor(this.id);"> ? </span>
<span id="span3" onclick="document.getElementById
('rateText').innerHTML='Okay', setColor(this.id);"> ? </span>
<span id="span4" onclick="document.getElementById
('rateText').innerHTML='Unsatisfied', setColor(this.id);"> ? </span>
<span id="span5" onclick="document.getElementById
('rateText').innerHTML='Terrible', setColor(this.id);"> ? </span>
</div></h1>
<div style="float:right;padding-right:450px">
<h3><p id="rateText"></p></h3>
</div>
Javascript Dieser Code ändert sich die Farbe der Schaltfläche, wenn die Taste
<script type="text/javascript">
function setColor(btn){
var property = document.getElementById(btn);
property.style.color = "#FFFF00"
}
</script>
CSS Farbe auf Maus Dieser Code Link bewegen die Tasten und Änderung
<style type="text/css">
#rateText{
text-align:right;
}
.rating {
unicode-bidi: bidi-override;
direction: rtl ;
}
.rating > span:hover:before,
.rating > span:hover ~ span:before {
content: "\2605";
position: absolute;
color: #FFFF00;
}
</style>
Gut sieht aus, als ob Sie nicht einen festen Stern verwenden, deshalb ändert sich nur die Grenze, da das alles Charakter ist. – epascarello
können Sie mir ein Beispiel zeigen, wie Solid Stern bitte @epascarello –