0

私は、写真家の画像のサイズ、順序、配置をランダムにし、クリック アンド ドラッグできるようにするよう依頼されたこのサイトを構築しています。この1つの大きな問題を除いて、これはすべて非常にスムーズに進んでいます.

すべてが Firefox で問題なく動作しますが、Chrome または Safari (おそらく他のブラウザー) で開くと、すぐに読み込まれるウィンドウに表示されない画像は、ドラッグしようとすると消えてしまうようです。「消えた」後に上にスクロールすると、クリックとドラッグの動きを追跡しながら、画像が実際にページの上部に送信されていることに気付くでしょう。

以前にこのエラーが発生しましたが、不要になった JavaScript を削除することで修正されたと思います。しかし今回は、特定の JS または jQuery ライブラリへのリンクを削除するあらゆる組み合わせを試したようですが、それでも解決策が見つかりません。

この問題を解決する方法を知っている人はいますか?

ここで問題とコードを確認できます: http://www.coreytegeler.com/jb/oddfuture/

編集Draggable 機能のみに依存しているようです。以下以外のすべての JavaScript コードを削除しましたが、問題は引き続き発生します

$(function() {
$( ".vert" ).draggable();
$( ".horiz" ).draggable();
});

編集これは、問題と関係があるように見えます

    var imgInit_x, imgInit_y, mouseInit_x, mouseInit_y, elem;
document.addEventListener('mousedown', startDrag, false);
document.addEventListener('mousedown', drag, false);
document.addEventListener('mousedown', endDrag, false);

function startDrag(e)
{
    if (e.target.tagName.toUpperCase == "IMG")
    {
        elem = e.target;
        imgInit_x = elem.style.left;
        imgInit_y = elem.style.top;
        mouseInit_x = e.layerX || e.offsetX;
        mouseInit_y = e.layerX || e.offsetX;
    }
}

function drag(e)
{
    try
    {
        currMouse_x = e.layerX || e.offsetX;
        currMouse_y = e.layerY || e.offsetY;
        elem.style.left = imgInit_x + currMouse_x - mouseInit_x;
        elem.style.top = imgInit_y + currMouse_y - mouseInit_y;
    }
    catch (err){}
}

function endDrag(e)
{
    elem = null;
}
4

1 に答える 1

0

あなたのコードにバグを見つけようとすると、次のようになります。

Uncaught ReferenceError: detector is not defined

問題が発生したdetectorときに変数が初期化されていないようです。その使用法を指定できますか？また、あなたの最新の Javascript スクリプトをざっと読んだのですが、目的が見つかりませんでしたか? Javascript を削除してみてください。問題が解決する場合があります。

于 2013-02-28T15:37:01.197 に答える