This article mainly introduces JavaScript to achieve ultra-simple mouse drag effect, and involves related skills related to JavaScript response to mouse event dynamic page elements. It has some reference value, for more information about JS implementation, see the following example. We will share this with you for your reference. The details are as follows:
Use JavaScript code as short as possible to write a JS drag. The function itself contains 287 characters... It can be shorter if compatibility and variable encapsulation are not considered.
The running effect is as follows:
The Online Demo address is as follows:
Http://demo.jb51.net/js/2015/js-s-drug-demo/
The Code is as follows:
Write a JS drag as short as possibleScript function dragable (id) {var d = document, o = d. getElementById (id), s = o. style, x, y, p = 'onmousemove '; o. onmousedown = function (e) {e = e | event; x = e. clientX-o.offsetLeft; y = e. clientY-o.offsetTop; d [p] = function (e) {e = e | event; s. left = e. clientX-x + 'px '; s. top = e. clientY-y + 'px '}; d. onmouseup = function () {d [p] = null }}dragable ("demo"); script
I hope this article will help you design JavaScript programs.