The Jquery emotions plugin helps you to convert text symbols to emotion images like in social chat editors similar to facebook. Who doesn't want smileys as they type their emotions out?
These are the text codes for emotions names references.
Calling Plugin
Plugin Code
This code helps to replace text code to emotion icons using array mapping.
Plugin Variable Info
You can try our DEMO and also Download the script. Read more:
The Basic Setup
Include the jQuery and emotions plugin libraries into your document using script tag.
<script src="js/jquery.js"></script>
<script src="js/jquery.emotions.js"> </script>
<script src="js/jquery.emotions.js"> </script>
These are the text codes for emotions names references.
Name | Icon | Code | Name | Icon | Code |
---|---|---|---|---|---|
Angel | o:) | Colonthree | :3 | ||
Confused | o.O | Cry | :'( | ||
Devil | 3:) | Frown | :( | ||
Gasp | :O | Glasses | 8) | ||
Grin | :D | Grumpy | >:( | ||
Heart | <3 | Kiki | ^_^ | ||
Kiss | :* | PacMan | :v | ||
Smile | :) | Squint | -_- | ||
Sun Glasses | 8| | Toungue | :p | ||
Unsure | :/ | Upset | >:O | ||
Wink | ;) |
Calling Plugin
$(document).ready(function()
{
$(“selector”).emotions();
});
{
$(“selector”).emotions();
});
Plugin Code
This code helps to replace text code to emotion icons using array mapping.
$.fn.emotions.defaults = {
a : "emotions-fb/", // Emotions folder
b : newArray("angel","colonthree","confused","cry","devil","frown","gasp","glasses","grin","grumpy","heart","kiki","kiss","pacman","smile","squint","sunglasses","tongue","unsure","upset","wink"), // Emotions Type
s : new Array("o:)",":3","o.O",":'(","3:)",":(",":O","8)",":D",">:(","<3","^_^",":*",":v",":)","-_-","8|",":p",":/",">:O",";)"),
c : "gif" // Emotions Image format
};
a : "emotions-fb/", // Emotions folder
b : newArray("angel","colonthree","confused","cry","devil","frown","gasp","glasses","grin","grumpy","heart","kiki","kiss","pacman","smile","squint","sunglasses","tongue","unsure","upset","wink"), // Emotions Type
s : new Array("o:)",":3","o.O",":'(","3:)",":(",":O","8)",":D",">:(","<3","^_^",":*",":v",":)","-_-","8|",":p",":/",">:O",";)"),
c : "gif" // Emotions Image format
};
Example Usage
Included jQuery plugin in head tag and ajax code included in this jquery function $("#showText").emotions()- showText is the ID name of div tag. Emotions plugin helps to converts <3 to emotion icon.
<html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.emotions.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#showText").emotions();
});
</script>
</head>
<body>
<div id='showText'>
I Love You <3
</div>
</body>
</html>
<head>
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.emotions.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$("#showText").emotions();
});
</script>
</head>
<body>
<div id='showText'>
I Love You <3
</div>
</body>
</html>
Plugin Variable Info
// Notes
// a - icon folder
// b - emotions name array
// c - image format
// a - icon folder
// b - emotions name array
// c - image format
:p :p :p :p first :p was changed unfortunately next :p wasn't changed fix it pls
ReplyDelete