【问题标题】:clone of dragged element and place it in dragged div area using sortable jqueryui使用可排序的 jqueryui 克隆拖动的元素并将其放置在拖动的 div 区域中
【发布时间】:2014-01-22 21:45:19
【问题描述】:

我正在尝试克隆拖动的元素并将其放置在拖动元素所在的区域中,不透明度为 0.2。由于某种原因,它不能完美地工作。占位符可以移动并显示放置元素的位置,但从拖动元素的区域应该显示不透明度降低的克隆,直到元素被放置。

js 小提琴:

http://jsfiddle.net/Fj7eN/

html:

<div id="sortable">
    <div class="one sortableElems">Div 1</div>
    <div class="two sortableElems">Div 2</div>
    <div class="three sortableElems">Div 3</div>
</div>

jquery:

$(function() {      
    $("#sortable").sortable({
        opacity: 0.8,
        cursor:"-webkit-grab",
        placeholder: {
            element: function(item, ui) {
                return item.clone().css({
                    "opacity":"0.2", 
                    "position":"relative"
                });
            },
            update: function() {
                return;
            }
        }
    });
});

【问题讨论】:

  • 看起来和以前一样
  • 占位符不应该移动..而是应该在可放置区域显示绿色边框

标签: jquery html jquery-ui jquery-ui-sortable


【解决方案1】:

自己找到了答案:

js 小提琴:

http://jsfiddle.net/Fj7eN/5/

jquery:

$(function() {  
    $("#sortable").sortable({
        opacity: 0.8,
        cursor:"-webkit-grab",
        start:function(e,ui){
            $(ui.item[0]).css({"display":"block","opacity":"0.2"});
        },
        helper:"clone",
        placeholder: "placeholder",
        update:function(e,ui){
           $(ui.item[0]).css({"opacity":"1"});
        }
    });
});

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-07
    • 1970-01-01
    • 2012-05-19
    • 1970-01-01
    • 2011-08-28
    • 1970-01-01
    相关资源
    最近更新 更多