$('#title').on("mousedown",function(e){
console.log(e);
})
e包含了：（鼠標(biāo)點(diǎn)擊部分的四種方式）
相對于頁面顯示部分的左上角的定位（滾動條隱藏部分也算）
pageX
pageY
相對于頁面顯示部分的左上角的定位（可見范圍內(nèi)）
clientX
clientY
相對于當(dāng)前元素的左上角的位置
offsetX
offsetY
相對于屏幕的左上角的位置
screenX
screenY
HTML5拖拽
在HTML標(biāo)簽上寫一句：draggable=“true”
一個(gè)很好用的jq拖動插件
http://pep.briangonzalez.org/
skdding.github.io/dragdealer/
比如滑塊飞崖，圖片輪播，都可以用到這些插件
<div id="container" class="container"></div>
<div id="target" class="target" draggable="true"></div>
<img id="image" src="imooc.png" class="hide" />
<script>
(function($) {
$("#container")[0].ondrop = function(e) {
e.preventDefault();
console.log(e.dataTransfer);
var id = e.dataTransfer.getData("Text");
$(this).append($('#' + id));
};
$("#container")[0].ondragover = function(e) {
e.preventDefault();
};
$("#container")[0].ondragenter = function(e) {
e.preventDefault();
$(this).addClass("containerDrop");
};
$("#container")[0].ondragleave = function(e) {
e.preventDefault();
$(this).removeClass("containerDrop");
};
$("#target")[0].ondragstart = function(e) {
console.log(e.dataTransfer);
e.dataTransfer.setData("Text", e.target.id);
e.dataTransfer.setDragImage($("#image").clone().removeClass("hide")[0], 0, 0);
};
$("#target")[0].ondrag = function(e) {
console.log('drag');
}
$("#target")[0].ondragend = function(e) {
console.log('dragend');
}
})(jQuery);
</script>
