可拖動在Chrome / Safari中不起作用

Question

我正在建立這個網站，要求我在其中隨機設置攝影師照片的大小，順序和位置，並能夠單擊和拖動它們。 除了這一主要問題之外，所有這些工作都很順利。

盡管在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;
}

Answer 1

當我嘗試破壞您的代碼時，我得到：

Uncaught ReferenceError: detector is not defined 

發生問題時，似乎未初始化detector變量。 您可以指定其用法嗎？ 我也瀏覽了您的最后一個Javascript腳本，找不到任何目的嗎？ 嘗試刪除Javascript，它可能會解決您的問題。