In general, I created a beautiful rating form, it works without JS, but I need to revive it:
.rating-form { padding-top: 20px } .rating-form:after { display: table; clear: both; content: "" } .rating-form .total-vote { margin-bottom: 20px; color: #ccc } .rating { margin-bottom: 10px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end } .rating:after { display: table; clear: both; content: "" } .rating label, .rating>input:checked ~ label { width: 16px; height: 16px; overflow: hidden; white-space: nowrap; cursor: pointer; text-indent: -9999px } .rating:not(:checked)>label, .rating>input:checked ~ label, .rating:not(:checked)>label:hover, .rating>input:checked+label:hover, .rating>input:checked+label:hover ~ label, .rating>label:hover ~ input:checked ~ label, .rating:not(:checked)>label:hover ~ label { background: url("http://artlenk.ru/project/star.png") no-repeat } .rating:not(:checked)>input { position: absolute; top: -9999px; clip: rect(0, 0, 0, 0) } .rating:not(:checked)>label { background-position: 0 -16px } <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="https://raw.githubusercontent.com/js-cookie/js-cookie/master/src/js.cookie.js"></script> <form action="#" class="rating-form"> <div class="rating"> <input type="radio" id="star5" name="rating" value="5"> <label for="star5" title="5">5</label> <input type="radio" id="star4" name="rating" value="4"> <label for="star4" title="4">4</label> <input type="radio" id="star3" name="rating" value="3"> <label for="star3" title="3">3</label> <input type="radio" id="star2" name="rating" value="2"> <label for="star2" title="2">2</label> <input type="radio" id="star1" name="rating" value="1"> <label for="star1" title="1">1</label> </div> <div class="total-vote"><span class="count">2</span> голоса</div> </form> - When clicking on a star, the value from value is taken and 1 click is taken into account, which is entered into the session.
- The click that was made on the star is displayed in .count (the session does not allow the script to count the clicks of one user).
- If another user (or from another browser) puts a rating (by clicking on a star), the first two points are repeated again and the votes are summed up, displayed on the screen with the tag with the class .count
I understand this, but I cannot write these actions to the script.