IE7でjQuery UI Positionユーティリティの動作

Question

現代のブラウザを使用するために私たちのサイトを更新中ですが、私はまだIE7の洞窟をサポートする必要があります。 jQuery UIの位置ユーティリティに関する問題が発生しています。 IE 7（ドキュメントモード7）をエミュレートするIE 11を使用して、Windows 7 OSで奇妙な動作が発生します。奇妙な動作はIE7（ドキュメントモード7）をエミュレートするIE 11を使用して、私には存在しません。

IE7（エミュレートされていない）または問題の発生したテスターと同じ設定のいずれかを使用して、この問題が発生するかどうかを確認する必要があります。

divの右上にある不足している画像要素の上にカーソルを置くと、問題が発生します。並べ替えられていないリストは、ホバー上に1回現れ、その後のホバーは何も表示されません。ホバリングとホバリングのどちらも、順序付けられていないリストから始まることはありません。

ここでは、上記の作業スペースと同じ作業スペースを使用している場合に問題が発生するはずです。

https://jsfiddle.net/bpdxL1e6/

var hoverCollection = $('.current-menu-item'); 
    $.each(hoverCollection, function(index, object) { 
    $(object).hover(function() { 
     $(object.lastChild).position({ 
     my: "right top", 
     at: "bottom right", 
     of: object.parentElement, 
     collision: "flipfit" 
     }); 
    }); 
    }); 

そのハード位置ユーティリティを伝えるために、それの目的はホバーにビューポートに表示順不同リストを維持するために主にあるとして、jsFiddleに全く取り組んでいます。

私は自分のデスクトップ上にフィーリングの内容を持つローカルhtmlドキュメントを持っており、ポジションの効果を確認しています。

ここに、完全なhtmlファイルのダウンロードへのリンクがあります。 http://www.filedropper.com/testhtmlfiddle

Answer 1

私は自分自身の位置決めユーティリティを書きました。そのhoverCopterと呼ばれる。 IE7だけでなく、他の最新のブラウザもサポートしています。

var hoverCollection = $('.current-menu-item'); 
var hoveringCollection = []; 
$.each(hoverCollection, function(idx, object) { 
    hoveringCollection.push(object.lastChild); 
}); 
hoverCopter(hoverCollection, hoveringCollection); 


function hoverCopter(objectsToTriggerHover, objectsToHover) { 
    $.each(objectsToTriggerHover, function(idx, object) { 
    $(object).hover(function() { 
     var bool = true; 

     var objWidth = $(object).offset().left + $(objectsToHover[idx]).width(); 
     var winWidth = $(window).width() + $(window).scrollLeft(); 
     var objHeight = $(object).offset().top + $(objectsToHover[idx]).height(); 
     var winHeight = $(window).height() + $(window).scrollTop(); 

     if (objWidth > winWidth) { 
     var left = (objWidth - $(object).width()/2) - winWidth + (winWidth - $(object).offset().left); 
     $(objectsToHover[idx]).css({ 
      'left': -left + 'px' 
     }); 
     } else { 
     $(objectsToHover[idx]).css({ 
      'left': 0 + 'px' 
     }); 
     } 
     if (objHeight > winHeight) { 
     var top = (objHeight - $(object).height()/2) - winHeight + (winHeight - $(object).offset().top); 
     $(objectsToHover[idx]).css({ 
      'top': -top + 'px' 
     }); 
     bool = false; 
     } else { 
     $(objectsToHover[idx]).css({ 
      'top': 0 + 'px' 
     }); 
     } 

     // this is a zIndex hack for IE7 so that the ul display above the images 
     var elements = $('[name="homepart_nav_wrap"]'); 
     var int = 100; 
     $.each(elements, function(idx, object) { 
     if (bool == false) { 
      $(object).css("zIndex", idx); 
     } else { 
      $(object).css("zIndex", int); 
     } 
     int--; 
     }); 

    }); 
    }); 
} 

ここにはjsFiddleがあります。 https://jsfiddle.net/bpdxL1e6/3/