0

私は、次のテストに使用できる Web アプリに取り組んでいます。

"http://83.150.87.220/dropbox/HelsinkiViSeZip/Jatkasaari"

(主に) 画像をズームインし、同じ画像をパンするために使用されます。

ドキュメントが読み込まれ、中央の画像が表示されると、その画像をパンするか、パンすることができmousedown + dragますzoom in/out

マウス ボタンを押し下げると、画像がぼやけ、カーソルのすぐ下にインジケーター (png 画像) が表示されることに気付くでしょう。そのインジケータは、アクション (ズーム/パン) を選択するためにカーソルを移動する方法を示します。

Chrome ではすべてが正常に機能しますが、FF ではmousedown、2 回目の画像上でカーソルのドラッグを開始すると、インジケーター (png前述の画像) がドラッグされてすべてが台無しになっているように見えます。これは、どのブラウザーでも画像をクリックしてドラッグするためのデフォルトの動作のようです。しかし、最初のmousedown+cursor drag組み合わせではすべてがうまく機能するので、これは非常に奇妙です。言うまでもなく、画像のデフォルトのアクションを確実に防止しました:

$(document).on('mousedown dragstart', 'img, a.icon', function(event) {  
    event.preventDefault(); 
}); 

問題を見つける方法についてのアイデアがすべて枯渇しているので、頭がおかしくなっています...誰か助けてもらえますか?

前もって感謝します!

4

2 に答える 2

0

divコンテナなどの内部の背景画像として設定し、img要素を使用する代わりにそれを表示/非表示にすることができます。そうすれば、カーソルで画像を実際に「選択」することはできませんが、JavaScriptで駆動されている場合は、すべてが機能するはずです。

于 2012-06-01T15:09:55.203 に答える
0

return false;私は同様の問題に直面していましたが、ブラウザのデフォルトの動作を防ぐ必要があるようです。

ここにフィドルがあります

于 2013-11-05T14:35:19.043 に答える