ドラッグアンドドロップ機能を実装するためにjqueryのドラッグアンドドロップ可能を使用しています。2つのタブがあり、それぞれにドラッグアンドドロップ可能なドロップ可能ゾーンが含まれています。これで、ドラッグ可能なものを選択して他のタブに移動できます。ドラッグプロセス中にタブ上を移動すると、タブが変わります。(あるディレクトリから別のディレクトリにファイルを移動する場合は、MS WinExplorerと同じように...)。ユーザーがドロップ可能なゾーンの上にいることを示すために、hoverClass-optionを使用します。
問題:ドラッグ中にタブを数回変更した後、ホバー効果が失われます。ブラウザサイズにスクロールバーが必要で、ドラッグ可能なポインタをブラウザの境界線の1つに移動すると(ブラウザがスクロールするように)、ホバー効果が表示されます。ドロップ可能なものにオーバーイベントを追加して、これが常に発生するかどうかを確認しましたが、そうではありません。
$('.drag').draggable({
revert: 'invalid',
helper: function () {
return $('<div></div>').addClass('drag-dragging').appendTo('body').text($(this).text());
}
});
$('#panel-1-droppable,#panel-2-droppable').droppable({
accepts: 'drag',
hoverClass: 'panel-dropover',
over: function () {
// just to check the over-event
$('#over-state').text('Mouseover with draggable [' + $(this).attr('id') + ']');
}
});
$('.panel-tab').droppable({
over: function () {
// changing tab...
}
});
問題を再現するためのテストシナリオを作成しました:http://jsfiddle.net/CKYJs/5/
必要な情報をすべて提供したと思います...