jQuery UI实现div的拖动、缩放功能分享

首先需要引入jQuery UI样式以及js文件
注意：请自行下载jqueryui的js和css文件
<link rel="stylesheet" href="//yizuotu.net/libs/jqueryui/1.10.4/css/jquery-ui.min.css">
<script src="//yizuotu.net/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="//yizuotu.net/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>

1，然后创建div

<div id="zzzyk" style="width: 100px;height: 100px; border: 1px solid red;">
<div id="drag1" style="width: 20%;height: 20%; border: 1px solid;">drag</div>
</div>

2，设置拖动及缩放事件

<script type="text/javascript">
    $(function(){
        $("#zzzyk").resizable();//设置缩放
        $("#drag1").draggable({containment: "#zzzyk",scroll: false});//设置drag1只能在zzzyk中拖动
    });
</script>