在HTML5中，div拖動(dòng)非常實(shí)用，通過拖動(dòng)可以實(shí)現(xiàn)許多有用的功能，如移動(dòng)元素、更改元素大小等。下面我們來介紹一下HTML5中如何設(shè)置div拖動(dòng)功能。

//HTML
<div id="myDiv">這是一個(gè)div</div>//CSS
#myDiv {
width: 100px;
height: 100px;
background-color: red;
position: absolute;
left: 0px;
top: 0px;
}

首先，我們需要在HTML中創(chuàng)建一個(gè)div元素，并給其id命名為“myDiv”。在CSS中，我們?yōu)檫@個(gè)div設(shè)置了寬、高、背景色和定位等樣式。

//JavaScript
var myDiv = document.getElementById('myDiv');
var dragging = false;
var iX, iY;
myDiv.onmousedown = function(e) {
dragging = true;
iX = e.clientX - myDiv.offsetLeft;
iY = e.clientY - myDiv.offsetTop;
return false;
};
document.onmousemove = function(e) {
if (dragging) {
myDiv.style.left = e.clientX - iX + 'px';
myDiv.style.top = e.clientY - iY + 'px';
}
};
document.onmouseup = function(e) {
dragging = false;
};

接下來，我們使用JavaScript代碼實(shí)現(xiàn)拖動(dòng)功能。首先，我們獲取到div元素和鼠標(biāo)按下時(shí)鼠標(biāo)的位置，然后通過設(shè)置一個(gè)dragging變量來判斷當(dāng)前鼠標(biāo)是否在拖動(dòng)狀態(tài)。

當(dāng)鼠標(biāo)按下時(shí)，我們將dragging變量設(shè)置為true，并獲取鼠標(biāo)當(dāng)前位置與myDiv左上角坐標(biāo)的差值，即iX和iY。

接著，當(dāng)鼠標(biāo)移動(dòng)時(shí)，判斷dragging是否為true，如果是true則將myDiv的left和top屬性都設(shè)置為鼠標(biāo)當(dāng)前位置與iX、iY的差值加上之前myDiv的位置值。這樣，隨著鼠標(biāo)的移動(dòng)，myDiv也隨之移動(dòng)。

最后，當(dāng)鼠標(biāo)釋放時(shí)，我們將dragging變量設(shè)置為false，結(jié)束拖動(dòng)。

這就是使用HTML5實(shí)現(xiàn)div拖動(dòng)的方法，通過JavaScript的鼠標(biāo)事件以及CSS的定位等屬性，可以實(shí)現(xiàn)更多高效的拖動(dòng)功能。