jQuery---鼠标滚轮控制div横向滚动条左右移动
时间:2019-06-11 19:04:17
收藏:0
阅读:912
HTML
<div class="table-responsive"> <div class="fhtable" style="width:2000px"></div> </div>
JavaScript
//鼠标滚轮控制div左右移动 $(".fhtable").each(function(index,element) { element.onwheel = function(event){ var table = $(element).parents(".table-responsive"); var right = $(element).width()-table[0].offsetWidth; if (table.scrollLeft()<right&&event.deltaY>0) { //禁止事件默认行为(此处禁止鼠标滚轮行为关联到"屏幕滚动条上下移动"行为) event.preventDefault(); var left = (table.scrollLeft() + 50); table.scrollLeft(left) } if (table.scrollLeft()>0&&event.deltaY<0) { //禁止事件默认行为(此处禁止鼠标滚轮行为关联到"屏幕滚动条上下移动"行为) event.preventDefault(); var left = (table.scrollLeft() - 50); table.scrollLeft(left) } } })
这里不能上传JavaScript代码,所以只能显示HTML的效果
测试效果
原文:https://www.cnblogs.com/appskyy/p/11005398.html
评论(0)