Question

我有一个可拖动的div（jquery ui draggable），主要包含文本。我可以在拖动时更改div的内容吗？

（实际上，我想让它变得更小更漂亮）

Answer 1

以下是代码：

<style>
    #draggable { width: 150px; height: 150px; padding: 0.5em; background-color: green; }
    </style>
    <script>
    $(function() {
        $( "#draggable" ).draggable({
            start: function(event, ui) { $(this).css("height",10); },
            stop: function(event, ui) { $(this).css("height",150); }        
        });
    });
    </script>



<div class="demo">

<div id="draggable" class="ui-widget-content">
    <p>Drag me around</p>
</div>

</div><!-- End demo -->

Answer 2

drag怎么办？

拖动（event，ui）

在拖动过程中移动鼠标时触发，紧接在当前移动发生之前。

只需指定拖动回调：

$( "#draggable" ).draggable({
  drag: function( event, ui ) {
      // do something while dragging
  }
});

Answer 3

您可以将三个不同的事件挂钩，这可能使您能够按照自己的意愿行事。我会检查定义启动，拖动和/或停止事件的函数。这是api doc：http://jqueryui.com/demos/draggable/#event-drag

用jquery ui draggable拖动时修改div的内容

3 个答案: