UI | 输入 | 媒体 | 导航 | 其他 | 网页模板| APP模板| 常用代码| 在线代码

图标拖拽效果，兼容所有浏览器

所属分类：UI-拖和放

 39191  374  查看评论 (26)
分享到微信朋友圈
X
图标拖拽效果，兼容所有浏览器 ie兼容6
 查看演示  立即下载

插件使用很简单，调用drag函数


使用方法

引用

<script src="drag.js"></script>

html

<div id="parent">
    <div id="div1"></div>
</div>

js中调用对应的id即可。

var oDiv = document.getElementById('div1');
var oParent = document.getElementById('parent');


相关插件-拖和放
查看更多

jQuery拖动滑块选择数字插件sider.jquery.js

 通过拖动滑块快速输入数值，并可以设置常用的数值快速选择
  拖和放
 28377  313

页面多板块拖动，调整边缘，吸附效果（原创）

 接到一个需求：楼宇房间的简单布局：点击左侧房屋号码，到右面出现以后可以各种调整。
  拖和放
 32086  359

鼠标拖动翻页

 鼠标可以拖动表格来翻页，十分方便，界面也很漂亮
  拖和放
 29473  329

jQuery可任意拖拽排序菜单树机构树

 jQuery可任意拖拽排序菜单树机构树
  拖和放
 45140  410

讨论这个项目（26）回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    伴随着编程世界长大。 0
    2019/4/1 3:29:56
    没看到是jq插件网吗，还用原生document.getElementById干嘛，对于我们这种连接式的怎么搞，一堆ID同名不同父的，用了jq的$(demo)没用 回复
    ?? 那只包子 0
    2019/1/26 11:40:00
    这个能获取到拖拽的小方块的x、y位置嘛？ 回复
    sister 0
    2018/5/8 15:54:51
    流年master 0
    2017/11/10 16:37:15

    多个子集的话在“锾??落?”那个代码的基础上，修改一下：id属性，随便给个不同id就行

    	width: 50px; height: 50px;
	position: absolute; cursor: pointer;
}

<div id="num1" class="png1" onmousemove="readys(this.id)"></div>
<div id="num2" class="png1" onmousemove="readys(this.id)"></div>
<div id="num3" class="png1" onmousemove="readys(this.id)"></div>
        流年master0
        2017/11/10 16:38:12
        .png1{
	width: 50px; height: 50px;
	position: absolute; cursor: pointer;
}
    回复
    酷冷 0
    2017/9/8 15:58:44

    如果都多个子集都需要拖动呢

    回复
    jqueryBonnie 0
    2016/10/24 14:10:23
    NothingMore 0
    2016/10/20 10:10:19
    这个在移动端没有办法用。只能用在pc端吧 回复
    木槿瑾 0
    2016/9/18 17:09:51
    为什么自己弄完根本就没反应呢，是哪里出了问题 回复
    star0708 0
    2016/6/25 9:06:47
    很好用！！！
        对方正在输入......0
        2017/3/29 15:03:02

        是吗

    回复
    Jealee 0
    2016/1/28 10:01:17
查看更多评论
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • ⭐
  • 💖
  • 💔
取消回复