兼容PC和移动端的jQuery拖拽插件dragscroll.js

所属分类：输入-拖和放

19455 202 查看评论 (4)

分享到微信朋友圈

查看演示 website 立即下载

插件描述：兼容PC和移动端拖拽滚动jQuery插件

更新时间：2019-08-17 00:29:39

更新说明：新增拖动开始、拖动中、拖动结束后三个回调函数

$('.drag').dragscroll({
    onStart: function($this) {
        console.log($this);
    },
    onMove: function($this) {
        console.log($this);
    },
    onEnd: function($this) {
        console.log($this);
    }
});

更新时间：2019-08-12 23:56:29

dragscroll.js

兼容PC和移动端拖拽滚动jQuery插件

使用方法

需要调用jquery库和jquery.dragscroll.js

<script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="js/jquery.dragscroll.js"></script>

html

<div class="drag-box">
    <div class="drag">
        jQuery是一个快速、简洁的JavaScript框架......
    </div>
</div>

css

.drag-box {
	width:400px;
	height:200px;
	margin:20px auto;
	overflow:hidden;
	border:1px solid #e8e8e8;
	background:#f8f8f8;
	line-height:25px;
	font-size:14px;
}
.drag {
	width:150%;
	padding:10px;
	cursor:grab;
	-moz-user-select:none;
	-webkit-user-select:none;
	-ms-user-select:none;
	-khtml-user-select:none;
	user-select:none;
}