Menu
I am using the Emojione Area JavaScript plugin. However, I am only getting the text area displayed, without the emoji pane.
Here is my HTML file :
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.css">
<script type="text/javascript" src="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<script>
$(document).ready(function() {
$("#emojionearea1").emojioneArea({
pickerPosition: "left",
tonesStyle: "bullet"
});
</script>
<div class="row">
<div class="span6">
<textarea id="emojionearea1">Default :smile:</textarea>
</div>
</div>
</body>
</html>
857
There is two things to fix on your code:
So the should should be:
<html>
<head>
<link rel="stylesheet" href="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.css">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.js"></script>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<div class="row">
<div class="span6">
<textarea id="emojionearea1">Default :smile:</textarea>
</div>
</div>
<script>
$(document).ready(function() {
$("#emojionearea1").emojioneArea({
pickerPosition: "left",
tonesStyle: "bullet"
});
})
</script>
</body>
</html>
The Popup will appear on the Right side because Left is not a valid value for the propertie pickerPosition. According to the documentation (www.github.com/mervick/emojionearea) the only valid values are top, right and bottom. The value top is the default one
I Hope it helps you
Best regards
135
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
