jQuery.mousetip - 工具提示 jQuery 插件


未知
跨平台
JavaScript

软件简介

jQuery.mousetip 是一个轻量级 jQuery 插件,能够创建随着鼠标移动或鼠标位置不同的提示项。显示图片信息,如下图所示:

代码示例:

HTML

<div>Content<span class="tip">Mousetip 1</span></div>
<div>Content<span class="tip">Mousetip 2</span></div>
<div>Content<span class="tip">Mousetip 3</span></div>

jQuery

$(function() {    // Default
    $('div').mousetip('.tip');    // Custom Position
    $('div').mousetip('.tip', 20, 30);

});

CSS

span.tip {

    /* Required */
    position: absolute;
    z-index: 2;
    display: none;

    /* Optional */
    font-size: 15px;
    max-width: 150px;
    height: auto;
    padding: 10px;
    border-radius: 3px;
    box-shadow: 0 1px 2px #666;
    background: #FD0;
}