Components colorization is a standard job. Folks visually deal with knowledge significantly better when colours are utilized to them.
colorize.js is an easy jQuery computerized content material colorization plugin designed to colorize components relying on whether or not their worth matches a given vary.
This may be extraordinarily helpful once you need to emphasize content material to your guests however haven’t got time/assets for graphics.
See Additionally:
Methods to use it:
1. Obtain and cargo the colorizejs.js
plugin after the newest jQuery library (slim construct is really helpful).
<script src="/path/to/cdn/jquery.slim.min.js"></script> <script src="/path/to/src/colorizejs.js"></script>
2. Colorize the content material primarily based on its worth. Purple, for instance, implies that the worth is beneath the typical. Inexperienced, then again, stands for above common, and blue is left for colours which might be just about common.
<span id="instance"> 200 </span>
$(perform(){ $('#instance').colorizejs({ // bigger than 80 80: 'inexperienced', // bigger than 50 50: 'blue', // bigger than 0 0: 'purple', }); });
3. You may also apply CSS courses to the ingredient primarily based on its worth.
$(perform(){ $('#instance').colorizejs({ // bigger than 80 80: '.inexperienced', // bigger than 50 50: '.blue', // bigger than 0 0: '.purple', }); });
This superior jQuery plugin is developed by yegor256. For extra Superior Usages, please test the demo web page or go to the official web site.