开发者

Creating a tooltip over a table cell?

开发者 https://www.devze.com 2022-12-26 16:29 出处:网络
I have created a HTML table which has a function written in javascript that takes the valu开发者_Go百科e of the cursors position within a large table cell and then prints the value into a cell.

I have created a HTML table which has a function written in javascript that takes the valu开发者_Go百科e of the cursors position within a large table cell and then prints the value into a cell.

How would i go about printing the value in a tooltip instead of a table cell?


The simplest thing to do is to set the "title" attribute of some element.

element.title = "Something to show in a tooltip";

There are fancy Javascript tools to make fancy tooltips. You don't say where you want the tooltip, so it's not 100% clear what you're trying to accomplish.


you can go showing the cell content in a tooltip by something like this

jQuery.fn.applyTooltip = function(options) {

        var settings = $.extend({}, options);

        return this.each(function() {

            var ReqElemPosition = $(this).offset();

            $(this).hover(function() {

                $('body').append('<div class="tooltip"></div>');

                tooltip = $('.tooltip');

                tooltip.empty().append($(this).text());

                tooltip.fadeIn('fast').css({

                    top: ReqElemPosition.top + tooltip.height() * 2 - $('body').offset().top,

                    left: ReqElemPosition.left - ($('body').offset().left - $(this).offset().left)

                });

            }, function() {

                tooltip.fadeOut('fast', function() {
                    $(this).remove();
                });
            });

        });
    };

$(document).ready(function() {

    $('td').applyTooltip();
});
0

精彩评论

暂无评论...
验证码 换一张
取 消

关注公众号