DEV Community

Cover image for Star Rating System in HTML CSS & JavaScript

Posted on

Star Rating System in HTML CSS & JavaScript

A star rating is a rating question that gives people rate a product or service with several stars. The number of stars can range from 5 to 10 stars. A star rating question is a type of rating question that permits users to rank attributes on a scale represented with stars, instead of radio buttons or checkboxes.

In this program (Star Rating System) at first, there are only five stars without any description box. And when you click on the particular star then the review text (a text with emoji) and a description box will visible. The review text is shown in the image as "It is awesome with emoji" is a dynamic text that means this text will change according to your rating or review. And when you give a rating and write some description and click on the post button...the rating system container will be hidden and a fixed text will be appeared as "Thanks for rating us!" with the edit button on the right top corner. And when you click on that edit button, it'll redirect you to previous steps where you can edit your rating and message.

You can also download the source code files through the given link. Click here to download source code files.

Top comments (1)

nguyenconghb profile image
Nguyễn Công

not working, not save :(( help me