以下の jsFiddle で、[Click to show menu] リンクをクリックして、jScrollPane が添付された絶対位置の div を表示します。スクロールバーのつまみをドラッグし始めますが、マウスがスクロールバーの右側に少し移動できるようにしてから、マウスを放します。IE (バージョン 8、9、10) では、ドキュメント上でクリック イベントが生成され、コードがトリガーされてメニューが非表示になります。私がテストした他のすべてのブラウザー (Firefox、Chrome、Safari) では、ドキュメントでそのようなクリック イベントは生成されず、メニューは (必要に応じて) 表示されたままになります。
この Web アプリでは、メニューの外側 (つまり、ドキュメントに到達したもの) をクリックしてメニューを非表示にします。ただし、スクロールペイン自体から開始されたドラッグの副作用としてメニューが非表示になることは望ましくありません。
この問題を回避する簡単な回避策はありますか? 問題を回避するために jScrollPane を何らかの方法で更新できますか?
$(document).ready(function () {
$('.scroll-pane').jScrollPane();
$('#menu').click(function () {
console.info('menu clicked');
var api = $('.scroll-pane').show().data('jsp');
api.reinitialise();
return false;
});
$(document).click(function () {
console.info('document clicked');
$('.scroll-pane').hide();
});
$('.scroll-pane').bind('mousedown', function (ev) {
console.info('scroll pane mousedown');
}).bind('mouseup', function (ev) {
console.info('scroll pane mouseup');
}).bind('click', function (ev) {
console.info('scroll pane click');
return false;
});
});