jQuery implementiert spezielle Effekte von Bewertungsbewertungen, guten Bewertungen und schlechten Bewertungen_jquery

Die Implementierung der Bewertungsstufen ähnelt den Taobao-Spezialeffekten für gute Bewertungen und negative Bewertungen. Klicken Sie auf die verschiedenen Ebenensymbole, um den entsprechenden Text anzuzeigen.

Nachdem ich den Effekt gesehen habe, denke ich, dass jeder versteht, was ich sagen werde. Jetzt werde ich Ihnen den Code zeigen

Code kopieren Der Code lautet wie folgt:

.maxdiv div{
               height:10px;
               width:20px;
              border:1px solid #000;
float:left;
               margin:20px 2px 0px 5px;
}

Code kopieren Der Code lautet wie folgt:

                                                                                                                                                                                                                                                                                                                                                                                                                                                                 

Werfen wir abschließend einen Blick auf die JS. Der Herausgeber hat alle Kommentare oben zur Kenntnis genommen. Es ist eigentlich nicht schwierig, unser Verständnis zu vertiefen.

Code kopieren

Der Code lautet wie folgt: $(function(){ $(".maxdiv div").bind("hover",function(){ ​​​​ $(this).attr("style","background:red");//Style="background:red" zum aktuellen div hinzufügen;

          $("div:last").prevAll().attr("style","background:red");//Alles mit Stilen versehen;

            $(this).nextAll().attr("style","");//Alle Stile nach dem aktuellen div sind "";
        var dsize=$("div [style ='background:red']").size();//Erhalte die Anzahl aller Hintergründe, die style="background:red";
enthalten If(dsize==1)
           {
           $('span').text("Sehr schlecht");
}
          else if(dsize==2)
           {
          $('span').text("Difference");
}
          else if(dsize==3)
           {
​​​​ $('span').text("General");
}
          else if(dsize==4)
           {
           $('span').text("Okay");
}
          else if(dsize==5)
           {
          $('span').text("Sehr gut");
}
});
});



Meine persönlichen Fähigkeiten sind begrenzt, daher ist die Arbeit nicht sehr schön. Freunde in Not können sie annehmen und verschönern, haha.