All Projects → gjunge → Rateit.js

gjunge / Rateit.js

Licence: mit
Rating plugin for jQuery. Fast, Progressive enhancement, touch support, icon-font support, highly customizable, unobtrusive JavaScript (using HTML5 data-* attributes), RTL support, supports as many stars as you'd like, and also any step size.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to Rateit.js

Bootstrap Star Rating
A simple yet powerful JQuery star rating plugin with fractional rating support.
Stars: ✭ 985 (+574.66%)
Mutual labels:  star, rating, jquery
Andratingbar
A RatingBar library for android, you can customize size ,color ,spacing and image easily!Support right to left。效果可以参看:https://juejin.im/post/6844904143220391949
Stars: ✭ 582 (+298.63%)
Mutual labels:  star, rating
react-star-ratings
A customizable svg star rating component for selecting x stars or visualizing x stars
Stars: ✭ 128 (-12.33%)
Mutual labels:  rating, star
Awesomstar
Awesome (star)rating system with PHP, MySQL and pure JavaScript.
Stars: ✭ 15 (-89.73%)
Mutual labels:  star, rating
React Native Star Rating
A React Native component for generating and displaying interactive star ratings
Stars: ✭ 724 (+395.89%)
Mutual labels:  star, rating
rater-js
Star rating widget for the browser. Unlimited number of stars. No dependencies. No Jquery required.
Stars: ✭ 66 (-54.79%)
Mutual labels:  rating, star
Laravel Love
Add Social Reactions to Laravel Eloquent Models. It lets people express how they feel about the content. Fully customizable Weighted Reaction System & Reaction Type System with Like, Dislike and any other custom emotion types. Do you react?
Stars: ✭ 822 (+463.01%)
Mutual labels:  star, rating
Raty
🌟 Raty - A Star Rating Plugin
Stars: ✭ 2,292 (+1469.86%)
Mutual labels:  star, rating
Emotion Ratings
😠 😞 😑 😊 😍 This plugin allows you to create ratings using emojis
Stars: ✭ 37 (-74.66%)
Mutual labels:  rating, jquery
Yii2 Widget Rating
A Yii2 widget for the simple yet powerful bootstrap-star-rating plugin with fractional rating support (sub repo split from yii2-widgets)
Stars: ✭ 47 (-67.81%)
Mutual labels:  star, rating
Laravel Reactions
Laravel reactions package for implementing reactions (eg: like, dislike, love, emotion, etc) on Eloquent models.
Stars: ✭ 58 (-60.27%)
Mutual labels:  star, rating
Starrate
swift电商五星评价,星星评分控件,支持自定义数量、拖拽、间隔、设置最小星星数等操作
Stars: ✭ 85 (-41.78%)
Mutual labels:  star, rating
Mgstarratingview
MGStarRatingView is a view for rating.
Stars: ✭ 70 (-52.05%)
Mutual labels:  star, rating
Android Ratingreviews
Simple star rating system bars, a view similar to the ones seen on Google Playstore. ⭐🌟✨
Stars: ✭ 110 (-24.66%)
Mutual labels:  star, rating
Starnet
StarNet
Stars: ✭ 141 (-3.42%)
Mutual labels:  star
Jquery Menu Editor
Multilevel Menu Editor for Bootstrap 4.x (Html & Javascript code)
Stars: ✭ 144 (-1.37%)
Mutual labels:  jquery
Frontenddaily
前端开发博客,分享互联网最精彩的前端技术,欢迎关注我微信公众号:前端开发博客,回复 1024,领取前端进阶资料包,回复 加群,与大神一起交流学习。
Stars: ✭ 1,901 (+1202.05%)
Mutual labels:  jquery
Bornmay
Awesome Github Profile Readme. Github ReadMe Github Profile Readme Dynamic Github ReadMe Dynamic Github Profile ReadMe. Please Star and Fork
Stars: ✭ 140 (-4.11%)
Mutual labels:  star
Card
💳 make your credit card form better in one line of code
Stars: ✭ 11,365 (+7684.25%)
Mutual labels:  jquery
Jquery I18next
i18next plugin for jquery usage
Stars: ✭ 143 (-2.05%)
Mutual labels:  jquery

RateIt

Rating plugin for jQuery.

npm version NuGet

Quick start

Several quick start options are available:

  • Download the latest release.
  • Clone the repo: git clone https://github.com/gjunge/rateit.js.git.
  • Install with npm: npm install jquery.rateit.
  • Install with NuGet: Install-Package jQuery.RateIt.

Read the Wiki documentation or look at the examples page.

About

Fast, Progressive enhancement, touch support, customizable (just swap out the images, or change some CSS), Unobtrusive JavaScript (using HTML5 data-* attributes), RTL support, supports as many stars as you'd like, and also any step size.

Your feedback is more than welcome!

Why is RateIt different

Although it does the same job as the rest of the jQuery star rating plugins, the main difference is its simplicity. Most plugins create an element for each (partial) star, be it a div with a star background, or an img tag. Each of these tags gets a hover event, and a click event. And on these hover/click events it has to go and talk to the other stars, telling them to change their state.

So each star plugin does a lot of DOM alterations (adding the number of stars as elements), and adds lots of events (again the number of stars times 2).

RateIt uses basically three divs. One background (the inactive state), and two divs on top (the hover, and selected state). In addition it only attaches three event handlers (not counting the use of the reset button aside). Each of these divs has a x-repeating background, enabling as many stars as you want (or a big image with for example 5 different smilies one next to the other) without adding more elements or event handlers. Based on the position of the mouse, or the selected value, a certain width is applied to the selection div or the hover div.

Credits

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].