0

我正在使用下面的代码来初始化可拖动,使用帮助器来创建缓动效果。然而,使用 helper 会破坏容器并允许可拖动元素离开它们的容器。我如何将助手约束到容器?

更多信息:元素包含在左边框和上边框内,而不是右边框和下边框。

JSFiddle:http: //jsfiddle.net/qmkVR/12/

        $( ".drag" ).draggable( {
            containment: con_outer,
            scroll: false,
            helper: function(){
                return $('<div></div>').css('opacity',0);
            },
            drag: function(event, ui){
                $(this).stop().animate({
                    top: ui.helper.position().top,
                    left: ui.helper.position().left
                },200,'easeOutCirc');
            },
            start: function() {
                //Make the dragged item the top-most
                zindex ++;
                $(this).css("z-index",zindex);
            }
        }).each(function(index, value) {
            var $this = $(this);
            $this.click(function() {
                //Click only registers if the object isn't being as dragged
                if($this.is(".ui-draggable-dragging")) {
                    return;
                }
                clickPhoto(index);
            });
        }); 
4

1 回答 1

1

<div class="drag"></div>使用以下代码将帮助程序定义为。

helper: function(){
            return $('<div class="drag"></div>').css('opacity',0);
    },

JS小提琴

http://jsfiddle.net/qmkVR/13/

于 2013-10-31T01:44:32.623 回答