Home  >  Article  >  Web Front-end  >  DIV implementation ideas and codes that can be dragged with the mouse_javascript skills

DIV implementation ideas and codes that can be dragged with the mouse_javascript skills

WBOY
WBOYOriginal
2016-05-16 17:19:28856browse
复制代码 代码如下:


测试可动div




style="cursor:move;position:absolute;width:100px;height:60px;border:1px solid

silver;left:100px;top:100px;z-index:9999;">



document.all[]是文档中所有标签组成的一个数组变量,包括了文档对象中所有元素;
event.button的值:0没按键 1按左键 2按右键 3按左和右键 4按中间键 5按左和中间键 6按右和中间键 7按所有的键

下面对此代码进行改进,模仿window,并且让它可以盖住select
复制代码 代码如下:




测试可动div




style="cursor:move;width:100%;height:15px;background-color:#0066cc; font-size:10px;">
X


测试一下







现在这个可拖动的div是不是好很多了?不用担心select了。之前放出来的只能在IE下正常工作,主要是用了parentElement,现在我把它换成parentNode,调整了CSS样式,这样在FF下也能正常运行了。
Statement:
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