IE和Chrome中的jQuery UI工具提示位置不同

Question

在MSIE 11和Chrome 49中使用jQuery UI工具提示小部件时，我观察到不同的定位行为。

如果带有窗口小部件的页面在MSIE中滚动，则工具提示显示在错误的位置：

请参阅MSIE中的jsfiddle以证明问题。

    $(".helpIcon").tooltip({
      hide: false,
      show: false,
      position: {
        my: "right top+3",
        at: "right bottom",
        using: function(position) {
          console.log(position);
          $(this).css(position);
        }
      }
    });

https://jsfiddle.net/v9Lpxa05/3/

我正在做一些意想不到的事情？或者我需要申请哪个黑客？

Answer 1

这看起来像工具提示小部件中的错误。

出于某种原因，IE在创建工具提示div时跳过初始位置计算，并在显示时首先设置它。但是，如果top和left值是默认值，则position函数会进行额外计算，从而导致不同的行为。

快速而肮脏的解决方法是在调用top时将left和.position属性设置为初始值0：

var positionOriginal = $.fn.position;
$.fn.position = function(val) {
  if ( val ) {
    this.css("top", "0");
    this.css("left", "0");
  }
  return positionOriginal.call(this, val);
};

谨慎使用！这解决了眼前的问题，但这样的黑客通常不应该进入生产代码。行为可能会在以后的任何更新中发生变化

示例：https://jsfiddle.net/450uj66d/1/