jquery multibox

Home Licenses Contact

jEmotion

download jquery multibox Sometime you need to hide the emotion icons on your web to view exact content. jEmotion is a small jquery plugins help you do that by a click and you needn't to reload the page.

 

Example | How to use | Options

Click here to hide emotion icons
>:) :)) /:) <):) :)] :) :(( :( ;;) ;) >:D< :D :-SS #:-S :-? >:P :P (:| :| :-/ :-* =(( ~X( B-) :-S =)) O:-) :-B =; 8-| L-) :-& :-$ [-( :O) 8-} <:-P :x =P~ #-o =D> @-) :^o :-w :-< :-O :> :-c X( :-h 8->

How to use Top

  • Step 1 - Setup
    - Include just these two javascript files in your header.

    <script type="text/javascript" src="js/jquery.js"></script>
    <script type="text/javascript" src="js/jemotion.js"></script>

  • Step 2 - Activate
    - The only necessity is to have a HTML markup likes it:

    <div class="emotion"> >:) :)) /:) <):) :)] :) :(( :( ;;) ;) >:D< :D :-SS #:-S :-? >:P :P (:| :| :-/ :-* =(( ~X( B-) :-S =)) O:-) :-B =; 8-| L-) :-& :-$ [-( :O) 8-}
    <:-P :x =P~ #-o =D> @-) :^o :-w :-< :-O :> :-c X( :-h 8-> </div>

    - After it, select the links and call the Emotions. See some examples:

    <script type="text/javascript">
    var opt = {
    handle: "a#toggle",
    css: null //Note: don't put comma (,) after the last property
    }
    $('a.emotion).emotion(opt);
    </script>

    View full options

Options Top

Option Default Description
handle a#toggle The specified elements that the emotions will on of when you click on.
dir emotions/ The foleder that includes the emotion icons.
label On Emotions The name string show on hadle elements when you click on first.
style null The string of style on handle element when you click on first.
class null The class name that will added to handle element when you click on first.
emotions   The javascript object includes syntax of emotion icons. Default emotions:

emotions: [
{syntax: '&gt;:)',title: 'Devil',icon: '1.gif'},
{syntax: ':((',title: 'Crying',icon: '2.gif'},
{syntax: ';;)',title: 'batting eyelashes',icon: '3.gif'},
{syntax: '&gt;:D&lt;',title: 'big hug',icon: '4.gif'},
{syntax: '&lt;):)',title: 'cowboy',icon: '5.gif'},
{syntax: ':D',title: 'big grin',icon: '6.gif'},
{syntax: ':-/',title: 'confused',icon: '7.gif'},
{syntax: ':x',title: 'love struck',icon: '8.gif'},
{syntax: '&gt;:P',title: 'phbbbbt',icon: '10.gif'},
{syntax: ':-*',title: 'kiss',icon: '11.gif'},
{syntax: '=((',title: 'broken heart',icon: '12.gif'},
{syntax: ':-O',title: 'surprise',icon: '13.gif'},
{syntax: '~X(',title: 'at wits\' end',icon: '14.gif'},
{syntax: ':&gt;',title: 'smug',icon: '15.gif'},
{syntax: 'B-)',title: 'cool',icon: '16.gif'},
{syntax: ':-SS',title: 'nail biting',icon: '17.gif'},
{syntax: '#:-S',title: 'whew!',icon: '18.gif'},
{syntax: ':))',title: 'laughing',icon: '19.gif'},
{syntax: ':(',title: 'sad',icon: '20.gif'},
{syntax: '/:)',title: 'raised eyebrows',icon:'21.gif'},
{syntax: '(:|',title: 'yawn',icon: '22.gif'},
{syntax: ':)]',title: 'on the phone',icon: '23.gif'},
{syntax: '=))',title: 'rolling on the floor',icon: '24.gif'},
{syntax: 'O:-)',title: 'angel',icon: '25.gif'},
{syntax: ':-B',title: 'nerd',icon: '26.gif'},
{syntax: '=;',title: 'talk to the hand',icon: '27.gif'},
{syntax: '8-|',title: 'rolling eyes',icon: '29.gif'},
{syntax: 'L-)',title: 'loser',icon: '30.gif'},
{syntax: ':-&amp;',title: 'sick',icon: '31.gif'},
{syntax: ':-$',title: 'don\'t tell anyone',icon: '32.gif'},
{syntax: '[-(',title: 'no talking',icon: '33.gif'},
{syntax: ':O)',title: 'clown',icon: '34.gif'},
{syntax: '8-}',title: 'silly',icon: '35.gif'},
{syntax: '&lt;:-P',title: 'party',icon: '36.gif'},
{syntax: ':|',title: 'straight face',icon: '37.gif'},
{syntax: '=P~',title: 'drooling',icon: '38.gif'},
{syntax: ':-?',title: 'thinking',icon: '39.gif'},
{syntax: '#-o',title: 'd\'oh',icon: '40.gif'},
{syntax: '=D&gt;',title: 'applause',icon: '41.gif'},
{syntax: ':-S',title: 'worried',icon: '42.gif'},
{syntax: '@-)',title: 'hypnotized',icon: '43.gif'},
{syntax: ':^o',title: 'liar',icon: '44.gif'},
{syntax: ':-w',title: 'waiting',icon: '45.gif'},
{syntax: ':-&lt;',title: 'sigh',icon: '46.gif'},
{syntax: ':P',title: 'tongue',icon: '47.gif'},
{syntax: ';)',title: 'winking',icon: '48.gif'},
{syntax: ':)',title: 'happy',icon: '100.gif'},
{syntax: ':-c',title: 'call me',icon: '101.gif'},
{syntax: 'X(',title: 'angry',icon: '102.gif'},
{syntax: ':-h',title: 'wave',icon: '103.gif'},
{syntax: '8-&gt;',title: 'day dreaming',icon: '105.gif'}
]

 

Top