Home > Web Front-end > JS Tutorial > jQuery draggable div implementation code Script House revised version_jquery

jQuery draggable div implementation code Script House revised version_jquery

WBOY
Release: 2016-05-16 18:50:52
Original
996 people have browsed it

Of course, the code is also very convenient to use, and you don’t have to think about many things by yourself.
During the research process, I used jQuery to realize the dragging of a div. The code is attached at the end of this article.
For ideas on implementation, please refer to my article Draggable DIV (2).
When referring to the examples on the jQuery Chinese website, I found that when they triggered the click event in the title bar of the div window, they moved the position of the div a little higher, and the mouseup event was registered on the entire div window. This idea made me I am very inspired. It solves the error caused by the mouse moving very fast and the div cannot keep up. It is a very good solution.
In addition, please pay attention to event bubbling. In jQuery and any js code that implements div dragging, event bubbling must be prevented.
In the bind or unbind method of jQuery, it is best to use false as the return value of the function. If you don’t believe it, you can try true.
In general code, we use the stopPropagation method to stop the event bubbling process.
Rendering:
jQuery draggable div implementation code Script House revised version_jquery
Note that jquery-1.2.6.js is loaded in the text

Copy code The code is as follows:



asgfsdg
asgfsdg


Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template