可拖动在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，它可能会解决您的问题。