移动（有权限） 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Basic EasyLoader - jQuery EasyUI Demo</title>
<link rel="stylesheet" type="text/css"
    href="http://www.java1234.com/jquery-easyui-1.3.3/themes/default/easyui.css">
<link rel="stylesheet" type="text/css"
    href="http://www.java1234.com/jquery-easyui-1.3.3/themes/icon.css">
<link rel="stylesheet" type="text/css"
    href="http://www.java1234.com/jquery-easyui-1.3.3/demo/demo.css">
<script type="text/javascript"
    src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.min.js"></script>
<script type="text/javascript"
    src="http://www.java1234.com/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script type="text/javascript"
    src="http://www.java1234.com/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>
</head>
<body>
    <div
        style="position: relative; overflow: hidden; border: 1px solid #ccc; width: 500px; height: 300px">
        <div class="easyui-draggable" data-options="onDrag:onDrag"
            style="width: 100px; height: 100px; background: #fafafa; border: 1px solid #ccc;">
        </div>
    </div>
</body>
<script type="text/javascript">
function onDrag(e){
    var d = e.data;
    if (d.left < 0){d.left = 0}
    if (d.top < 0){d.top = 0}
    if (d.left + $(d.target).outerWidth() > $(d.parent).width()){
        d.left = $(d.parent).width() - $(d.target).outerWidth();
    }
    if (d.top + $(d.target).outerHeight() > $(d.parent).height()){
        d.top = $(d.parent).height() - $(d.target).outerHeight();
    }
}
</script>
</html>

 

posted on 2017-01-14 14:36  老邱2  阅读(103)  评论(0)    收藏  举报

导航