JSFiddle - React, Tailwind, and code Playground

by maxim75

HTML

<script src="http://dl.dropbox.com/u/40036711/Scripts/jquery.hovercard.js"></script>
<script type="text/javascript" src="http://dl.dropbox.com/u/40036711/notify.js"></script>

<p>
Some <span>link</span> with text
</p>

CSS

span {
    border: solid 1px #999;
    pointer: cursor;
}

body
{
    margin: 20px;
}

JavaScript

console.log($("body"));

 var hoverHTMLDemoBasic = '<p>' +
                        'John Resig is an application developer at Khan Academy. He was a ' +
                        'JavaScript tool developer for the Mozilla Corporation. He is also the' +
                        'creator and lead developer of the jQuery JavaScript library.<p>';


$("span").hovercard({
        detailsHTML: hoverHTMLDemoBasic,
        width: 400,
        cardImgSrc: 'http://ejohn.org/files/short.sm.jpg',
        onHoverIn: function () {
            //Place your callback code here. This example uses notification plugin to demonstrate
            $.notify('We see you just hovered over the label! <br/>Callback function <strong>"onHoverIn</strong>. ', {
                background: '#ffffbb',
                autoHide: true,
                autoHideDelay: 1000,
                clickAnywhereToClose: true,
                position: "bottom-right",
                width: 100
            });

        },
    });