demo預覽：https：//repl。it/@zhowdom/CompleteDeepskyblueWebsite
#code#
class Drag { constructor （id） { this。odiv = document。querySelector（id）； this。disx = 0； this。disy = 0； this。init（）； } init （） { this。odiv。onmousedown = function （ev） { this。disx = ev。clientX - this。odiv。offsetLeft this。disy = ev。clientY - this。odiv。offsetTop document。onmousemove = this。fnMove。bind（this） document。onmouseup = this。fnUp。bind（this） return false }。bind（this） } fnMove （ev） { this。odiv。style。left = ev。clientX - this。disx + ‘px’ this。odiv。style。top = ev。clientY -this。disy + ‘px’ } fnUp （） { document。onmousemove = null document。onmouseup = null } } class limitDrag extends Drag{ fnMove （ev） { super。fnMove（ev） if （this。odiv。offsetLeft < 0） { this。odiv。style。left = 0 } if （this。odiv。offsetTop < 0） { this。odiv。style。top = 0 } } } new Drag（‘#div1’） new limitDrag（‘#div2’）
