如何扩展jQuery draggable的可拖动区域

时间:2013-09-12 11:22:49

标签: javascript jquery html css jquery-ui

尝试增强jQuery draggable的可用性我遇到了以下问题。我有一个div容器,包含一个(小)图像和一个文本,为用户提供了将图像拖入文本编辑器的机会。

如果我将.draggable添加到img一切正常,但由于图像非常小,可用性并不好。

所以,我想要做的是使div容器可拖动,但只拖动img。有谁知道解决方案?

编辑:这是代码

HTML += '<div id="row'+file.id+'" class="box downloadfilerow" style="opacity: 1;height:'+(that.options.previewMaxHeight)+'px;overflow-y:auto;padding:8px 0px 8px 2px;border-bottom:1px solid #DDD;">';
if (file.preview_url) {
   if (<?=json_encode($uploadAllowed)?>) {
        HTML +='<div class="delete">';
        HTML +='<button class="btn" style="float:right;margin:'+(that.options.previewMaxHeight/8)+'px;" id="del'+file.id+'" title="<?=Yii::t('widgets/FileSelector', 'Delete')?>" rel="tooltip">';
        HTML +='<i class="icon-trash"></i>';
        HTML +='</button>';
        //HTML +='<input type="checkbox" name="delete" value="1" style="float:left;margin:0px 10px;height:'+that.options.previewMaxHeight+'px;">';
        HTML +='</div>';
    }
    HTML +='<div style="float:left;height:'+that.options.previewMaxHeight+'px"><img data-view-url="'+file.view_url+'" style="float:left;cursor:move;max-width:'+that.options.previewMaxWidth+'px;max-height:'+that.options.previewMaxHeight+'px;" data-file="'+file.id+'" data-filename="'+file.name+'" id="'+file.id+'" src="'+ file.preview_url +'"></div>';
    HTML += namedLink;
    HTML += fileSize;

$("#row"+file.id).draggable({ helper: 'clone', zIndex: 2700, appendTo: 'body'});

0 个答案:

没有答案