jQuery,title、仿title功能整理

如图:仿 title="查看"

note="查看",note 可换成其他

样式:

/*重写,标签title层*/
#titleRewrite {position:absolute; z-index:5999; padding:2px 10px; border-radius:3px; color:#fff; background:#5B697B; -webkit-box-shadow: 1px 1px 3px #ccc; -moz-box-shadow: 1px 1px 3px #ccc; box-shadow: 1px 1px 3px #ccc;}

JS:
$(function() {
    $("[note]").each(function() {
        var a = $(this);
        var note = a.attr('note');
        if (note == undefined || note == "") return;
        a.data('note', note)
            .removeAttr('note')
            .on('mouseover mouseout', function(e) {
                if (e.type == 'mouseover'){
                    var offset = a.offset();
                    $("<div id="titleRewrite"></div>").appendTo($("body")).html(note).css({ top: offset.top + a.outerHeight(), left: offset.left + a.outerWidth()/2 + 10 }).fadeIn(function () {
                        setTimeout(function () { $(this).remove(); }, $(this).text().length*800);
                    });
                    //console.log('111');
                }else {
                    setTimeout(function (){
                        $("#titleRewrite").remove();
                    }, 150);
                    //console.log('000');
                }
            });
            /*.hover(function (e) {
                /!*var xx = e.originalEvent.x || e.originalEvent.layerX || 0;
                 var yy = e.originalEvent.y || e.originalEvent.layerY || 0;
                 //$(this).text(xx + '---' + yy);
                 $("<div id="titleRewrite"></div>").appendTo($("body")).html(title).css({ top: yy + 10, left: xx + 10 }).fadeIn(function () {

                 var pop = $(this);
                 setTimeout(function (){
                 pop.remove();
                 }, pop.text().length*800);

                 });    *!/

                var offset = a.offset();
                $("<div id="titleRewrite"></div>").appendTo($("body")).html(note).css({ top: offset.top + a.outerHeight(), left: offset.left + a.outerWidth()/2 + 10 }).fadeIn(function () {
                    setTimeout(function () { $(this).remove(); }, $(this).text().length*800);
                });

            },function(){
                setTimeout(function (){
                    $("#titleRewrite").remove();
                }, 150);
            });*/
    });
});
原文地址:https://www.cnblogs.com/xiangsj/p/5884889.html