:
<! Doctype html> <html xmlns = "http://www.w3.org/1999/xhtml"> <éad> <méta http-equiv = "contenu-type" contenu = "text / html; charset = utf-8" /> <ititle> 鼠标拖动和拖拽的鼠标指针特效 </Title> <style> #box {width: 100px; hauteur: 100px; arrière-plan: # 966; position: absolue; gauche: 100px; top: 100px; curseur: pointer;} </ style> </-head> <corps {Width: Math.max (document.DocumentElement.ClientWidth, document.DocumentElement.ScrollWidth), Height: Math.Max (document.DocumentElement.ClientHeight, document.DocumentElement.ScrollHeight)};} Fonction Comparenum (X, Minnum, MaxNum) {Switch (True) {cas x <minnum: x = mine cas x> maxnum: x = maxnum; pause; par défaut: x; } return x; } box.style.left = '100px'box.style.top =' 100px'box.onmousedown = function (e) {var e = e || window.event; var maxl = getViewport (). Width-100, maxt = getViewport (). Height-100; this.startl = parseInt (this.style.left); this.startt = parseInt (this.style.top); //alert(e.clientx) this.startx = e.clientx; this.starty = e.clienty; // alert (maxl + ':' + maxt + ':' + l + ':' + t) doc.onmouseMove = function (e) {posxy (e, 0,0, maxl, maxt); }; doc.onmouseup = function () {doc.onmouseMove = null; doc.onmouseup = null; }; return false;} fonction posxy (e, minl, menthe, maxl, maxt) {var e = e || window.event; var x = box.startl- (box.startx-e.clientx); var y = box.startt- (box.starty-e.clienty); box.style.left = comparable (x, minl, maxl) + 'px' box.style.top = comparenum (y, menthe, maxt) + 'px'} </cript> </body> </html>[Ctrl + a 全选 注: 如需引入外部 js 需刷新才能执行]