0

我的屏幕上有一个 div 框。我希望用户可以随时调整 jquery 框的大小,并同时取消 jquery 可拖动事件,反之亦然。我正在为可拖动部分使用一个插件,当我调整框的大小时它会出现故障,因此解决方案是在我调整它的大小时取消可拖动事件。我在下面尝试了这段代码,但它不起作用,我知道逻辑不正确。我的问题是我将如何解决这个问题以使其工作?

<script src="http://code.jquery.com/jquery-latest.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js">
</script>

<script src="js/easing.js" ></script>
<script src="js/animadrag.js" ></script>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs
/jqueryui/1.7.1/themes/blitzer/jquery-ui.css">

<div class="body">
    <div class="move"></div>
</div>


<script type="text/javascript" >

$('.move').resizable();     

$('.move').on('hover',function (event) {
//something, although I don't know what, should be put here to cancel resizable
    $('.move').animaDrag({ 
                speed: 150, 
                interval: 120, 
                easing: null, 
                cursor: 'move', 
                boundary: '.body',
                grip: null,  
                overlay: true           
});     

</script>

这是有效的 jsbin 示例。http://jsbin.com/obovof/2/edit

4

1 回答 1

0

我不明白为什么要在调整大小期间禁用可拖动。从技术上讲,用户将无法在调整大小期间拖动元素。无论如何,如果你使用 jqueryui 方法可拖动而不是 animaDrag: 你可以这样做:

$('.move').draggable().resizable({
    start: function(e, ui) {$(this).draggable( "disable" )},
    stop: function(e, ui) {$(this).draggable( "enable" )}
});
于 2012-09-23T01:10:30.970 回答