jQuery工具提示检测屏幕边缘 [英] jQuery tooltip detect screen edge

问题描述

我有一些基本的悬停/工具提示代码工作，需要修改，以便当工具提示击中浏览器窗口的边缘时添加第二个类名.谁能伸出援手?

I have some basic hover/tooltip code working that needs to be modified so that a second class name is added when the tooltip hits the edge of the browser window. Can anyone lend a hand?

this.tooltip = function () {
    $(".challenge_card").hover(function (e) {
                $(this).parent().append("<div id='tooltip'></div>");
                $("#tooltip")
                        .fadeIn("fast");
            },
            function () {
                $("#tooltip").remove();
            });
};

推荐答案

var wW = $(window).width();
var $tooltip = $('#tooltip');

if($tooltip.offset().left + $tooltip.outerWidth() > wW){
  // You've hit the right side of the browser window
}

类似的事情应该起作用-当然不考虑最高位置，但是为您提供了检查工具提示位置的基本逻辑...

Something like this should work - doesn't take into account the top position of course, but gives you the basic logic to check the position of the tooltip...

这篇关于jQuery工具提示检测屏幕边缘的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！