1

我正在使用NiceScroll使容器可拖动。它本质上是一个被“掩盖”的时间表，可以左右拖动以查看一天中的更多时间。

我还使用Fancybox来弹出有关日程中每个事件的更多信息。

当您拖动日程表中没有活动事件的区域时，一切都很好。当您开始在具有活动事件 (.act) 的区域上拖动时，当您释放拖动时，它会打开 Fancybox。这是不希望的——我只是希望它停止拖动并且不打开 Fancybox。

是否可以在 open 或 beforeLoad 函数中使用某种比较来取消盒子的实际打开？如果 mousedown 位置距离鼠标向上位置超过 10px？

这是我为活动项目提供的代码：

$("#schedule .act").fancybox({
    openEffect:     'none',
    closeEffect:    'none',
    autoSize:       false,
    autoWidth:      false,
    autoHeight:     true,
    minHeight:      275,
    autoResize:     true,
    width:          500,
    padding:        [50, 60, 0, 60],
    arrows:         true,
    loop:           false,
    closeBtn:       '<a title="Close" class="fancybox-item fancybox-close" href="javascript:;">Close</a>',

    beforeLoad: function() {        
        $time = $(this.element).data('time');
        $type = $(this.element).data('type');
        $titl = $(this.element).data('title');
        $desc = $(this.element).data('desc');
        this.content = "<span class='time " + $type + "'> " + $time + " </span>" + "<span class='title'>" + $titl + "</span>" + "<div class='desc'>" + $desc + "</div>";
    }
});
4

1 回答 1

1

我知道了。困难的部分是让课程被删除。我尝试使用悬停状态，然后使用鼠标离开，但是当拖动开始时，直到释放拖动后，类才会被删除（即使鼠标离开元素）。在初始化我的 fancybox 调用之前，我的解决方案是：

var clickDrag;
$("#schedule .act").mousedown(function() {
    $(this).addClass("hovered");
    clickDrag = $(this);
    $("#schedule .act").mousemove(function() {
        $(this).removeClass("hovered");
    });
});

然后，在 fancybox 调用的 beforeLoad 中，我添加了：

if (!($(clickDrag).hasClass("hovered") ) ) {
    $.fancybox.cancel();
    return;
}
于 2013-04-04T18:22:51.563 回答