How to add tooltip on hovering on the nodes

[kuntalsam]

On each node. I am trying to show a tooltip containing more information. I could not find an easy way to do it. Please help.

[AemonCao]

javascript

$(".node").hover(function () {
    var title = $(this).children(".node-title").html();
    $('<div class="node-tip"></div>').html(title).appendTo('body').fadeIn('slow');
}, function () {
    $('.node-tip').remove();
}).mousemove(function (e) {
    var mousex = e.pageX + 20;
    var mousey = e.pageY + 10;
    // console.log(mousex + "|" + mousey);

    $('.node-tip')
        .css({
            top: mousey,
            left: mousex
        });
});

css

.node-tip {
    display: none;
    position: absolute;
    border: 0px solid #333;
    background-color: rgba(0,0,0,0.7);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    -webkit-box-shadow: #000 1px 5px 20px;
    -moz-box-shadow: #000 1px 5px 20px;
    box-shadow: #000 1px 5px 20px;
    padding: 10px;
    color: #fff;
    font-size: 16px;
    width: 250px;
}

[lchigami]

Is this working? I'm trying to implement tooltip with dynamic information and need help.

[squalsoft]

Add title in node and in css: .node-title { display: none; position: absolute; }

.node-name:hover + .node-title { display: block; }