使用draggable插件实现对象的拖曳操作8-1

来源：互联网发布：nginx log 时间格式编辑：程序博客网时间：2024/05/01 04:09

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>使用draggable插件实现对象的拖曳操作</title><script type="text/javascript" src="lib/jquery-2.1.1.js"></script><script type="text/javascript" src="lib/jquery-ui.js"></script><style type="text/css">body{font-size:13px}.div{margin:5px}.divFrame{border:dashed 1px #ccc;background-color:#eee;height:68px;width:200px;}.divDrag{border:solid 1px #ccc;background-color:#eee;cursor:move;width:40px;padding:20px;text-align:center}</style><script type="text/javascript">$(function(){$("#divDragD").draggable({opacity:0.35});$("#divDragX").draggable({axis:"x",opacity:0.35});$("#divDragC").draggable({containment:"parent",opacity:0.35,revert:true});})</script></head><body><div id="divDragD" class="divDrag">随意</div><div class="divFrame"><div id="divDragX" class="divDrag">X轴</div></div><div class="divFrame"><div class="divDrag" id="divDragC">父窗口</div></div></body></html>

draggable的使用说明：http://blog.csdn.net/dunyanan1/article/details/7404467

0 0