??? JQuery 最好的地方在于其方便的插件机制了，而且网上有很多人在贡献有用的插件，现在开始，我将慢慢的手机一些有用的插件。
?
??? JQuery 乃居家旅行必备之插件啦。。O(∩_∩)O哈哈~
?
?
????一、? Jquery插件EasyDrag：一行代码轻松实现拖动效果.
?
??? 效果如图：
?
?
?
????HTML代码：????????
<div id="divPanel" style="width:300px;height:300px;background:white;border:1px solid #000000;position:absolute;left:5px;top:50px" >
<div id="divTitle" style="width:100%;height:25px;background:lavender">
Title
</div>
<div style="width:100%">
</div>
</div>
??? js代码：
<script type="text/javascript" src="webapps/zsysp/js/jquery-1.6.2.min.js" ></script>
<script type="text/javascript" src="webapps/zsysp/js/jquery.easydrag.handler.beta2.js" ></script>
<script type="text/javascript">
$(document).ready( function(){
$("#divPanel").easydrag();
});
</script>
??
??? EasyDrag还可以指定可拖动的区域，比如只能通过标题拖动整个div，我们JS可以这样写：
$(document).ready( function(){
$("#divPanel").easydrag();
$("#divPanel").setHandler("divTitle");
});
?? 一个setHandler搞定,不错开源是个好东西，Jquery更是好东西，插件扩展机制不是一般的好。
? 参考路径：http://www.jzxue.com/wangzhankaifa/javascript-ajax/200905/13-2102.html
?
?
????二、? contextmenu(右键菜单)：使用简单方便，样式也可定制，但目前不支持多级菜单。
??? 效果如图：
?
?
?
?? HTML代码
<SPAN class=demo1 id=quickDemostyle="BORDER-RIGHT: #888 1px solid; BORDER-TOP: #888 1px solid; FLOAT: right; BORDER-LEFT: #888 1px solid; BORDER-BOTTOM: #888 1px solid"><B>DEMO</B>right-click me!! </SPAN> <div class="contextMenu" id="myMenu1"> <ul> <li id="open"> <img src="img/folder.png" /> Open </li> <li id="email"> <img src="img/email.png" /> Email </li> <li id="save"> <img src="img/disk.png" /> Save </li> <li id="close"> <img src="img/cross.png" /> Close </li> </ul> </div>
?
JS代码：
<link rel="stylesheet" href="css/page_style.css" type="text/css"></link>
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="js/jquery.contextmenu.r2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('span.demo1').contextMenu('myMenu1', {
bindings: {
'open': function(t) {
alert('Trigger was '+t.id+'\nAction was Open');
},
'email': function(t) {
alert('Trigger was '+t.id+'\nAction was Email');
},
'save': function(t) {
alert('Trigger was '+t.id+'\nAction was Save');
},
'delete': function(t) {
alert('Trigger was '+t.id+'\nAction was Delete');
}
}
});
});
</script>
?
更多内容请参考路径
?
?? 参考路径：http://www.trendskitchens.co.nz/jquery/contextmenu/
?
?
附件中已经上传了demo.....关于插件JS请下载啊。。。。。?