Giter Club home page Giter Club logo

emotion-ratings's Issues

One emoji and select different emotions.

Is it possible to have just 1 emoji and show the different options on that unique emoji?
Pretty much as facebook does, on mouse hover show the different options and then display it in one only emoji.

Nothing is visible

I found this script here: https://www.jqueryscript.net/other/Emoji-Rating-Plugin-jQuery-Emotion-Ratings.html

Just to try it out, I created a basic HTML page:

<html>

	<head>		
	</head>
	
	<body>
	
		<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>

		<script type="text/javascript" src="https://www.jqueryscript.net/demo/Emoji-Rating-Plugin-jQuery-Emotion-Ratings/emotion-ratings.js"></script>

		<script>
			var emotionsArray = ['angry','disappointed','meh', 'happy', 'inLove'];
  			$("#element").emotionsRating(
  				{
    				emotionSize: 50,
    				bgEmotion: 'happy',
    				emotions: emotionsArray,
    				color: 'gold'
  				});
		</script>
	
	</body>
	
</html>

(I'll later use the JS on my own server, but, for trying it out, I have directly used it from that website).

In the browser's console, I see no errors, nothing. In the network tab, I see all the scripts have loaded, but, all I get is a plain, white page in the browser. I don't know what's wrong.

Initially, I tried to use the method as shown in the code section of this repo. That didn't work. (It was giving error: jQ is not defined). So, I went to the page from where I found the script and even that's not working.

I have also tried to load the jQery and the JS script in <head>.

What am I doing wrong?

Enable/Disable on the fly

@YanNerio I'm trying to enable/disable the rating bar on the fly. I have the following function, that should initialize the rating plugin as either enabled/disabled:

function initRatingWithState($, options, state){
    if ($.children().length) $.empty();
    const init = $.data('init');
    if (typeof init === 'number') options.initialRating = parseInt(init);
    options.disabled = state;
    $.emotionsRating(options);
}

It works perfectly when initializing the plugin the first time. All 'on-the-fly' changes do not work. Where am I going wrong?

EDIT: It doesn't work via the console, either.

Problem when setting colors

Hello,
Thanks for this great plugin, very complete !
However I experience a little problem when setting colors on the emojis.
For example:
color: "green",

My emojis still stay the same ... the color doesn't change.
I have this problem on Chrome.
Do you know how can I resolve this ?

Thanks in advance.

Emoji disablement

I tried to disabled emoji based on the condition it doesn't work guide me on this part

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.