var nextPress, prevPress;
     
      // 鼠标按下执行定时器,每0.1秒向左移一个li内容的宽度
       function nextDown() {
nextPress = setInterval(() => {
var lt = parseInt($(".overview").css("left")),
liWid = $(".overview").find("ul").find("li").outerWidth(true),
divWid = $(".overview").outerWidth(true);
          // 偏移的位置大于整体内容的宽度禁止右移
if(-lt >= divWid-4*liWid) {
clearInterval(nextPress);
} else{
$(".overview").css("left",lt-liWid);
}
}, 100);
} function prevDown() {
prevPress = setInterval(() => {
var lt = parseInt($(".overview").css("left")),
liWid = $(".overview").find("ul").find("li").outerWidth(true);
if(lt >= liWid) {
clearInterval(prevPress);
} else {
$(".overview").css("left",lt+liWid);
}
}, 100);
} // div中的右箭头按下向右移
$(".nav-btnNext").on("mousedown", () => {
nextDown();
})
$(".nav-btnNext").on("mouseup", () => {
// 箭头弹起清除定时器暂停右移
clearInterval(nextPress);
})
// div中的左箭头按下向左移
$(".nav-btnPrev").on("mousedown", () => {
prevDown();
})
$(".nav-btnPrev").on("mouseup", () => {
// 箭头弹起清除定时器暂停右移
clearInterval(prevPress)
})

  

js 长按鼠标左键实现溢出内容左右滚动滚动的更多相关文章

  1. js 鼠标左键拖动滚动

    鼠标左键拖动滚动 原作者: http://blog.csdn.net/lisatisfy/article/details/6606026 本文在源代码的基础上 增加支持水平滚动 的功能 html &l ...

  2. js进阶 12-17 jquery实现鼠标左键按下拖拽功能

    js进阶 12-17 jquery实现鼠标左键按下拖拽功能 一.总结 一句话总结:监听的对象必须是文档,鼠标按下运行mousemove事件,鼠标松开取消mousemove事件的绑定,div的偏移的话是 ...

  3. 【转】 js怎么区分出点击的是鼠标左键还是右键?

    IE 下 onMouseDown 事件有个 events.button 可以返回一个数值,根据数值判断取得用户按了那个鼠标键 events.button==0  默认.没有按任何按钮. events. ...

  4. Swing中如何比较好的判断鼠标左键双击

    import java.awt.Toolkit; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; im ...

  5. Vue 监听鼠标左键 鼠标右键以及鼠标中键修饰符click.left&contextmenu&click.middle

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. ctrl+鼠标左键监听

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  7. C# GDI绘制矩形框,鼠标左键拖动可移动矩形框,滚轮放大缩小矩形框

    最近工作需要,要做一个矩形框,并且 用鼠标左键拖动矩形框移动其位置.网上查了一些感觉他们做的挺复杂的.我自己研究一天,做了一个比较简单的,发表出来供大家参考一下.如觉得简单,可路过,谢谢.哈哈. 先大 ...

  8. zend studio中ctrl+鼠标左键无法转到类或函数定义文件的解决方法

    转载自:http://blog.csdn.net/wide288/article/details/21622183 zend studio中ctrl+鼠标左键无法转到类或函数定义文件的解决方法: ze ...

  9. [Eclipse] eclipse中打开xml文件,使用ctrl+鼠标左键无法跳转至Java源文件【待解决】

    eclipse中打开xml文件,使用ctrl+鼠标左键无法跳转至Java源文件: 1. 设置eclipse ctrl + 左键打开源文件代码,如下图,设置都正常 2. 在网上找了很多种办法,均失败,在 ...

随机推荐

  1. Celery Received unregistered task of type

    celery -A proj worker --loglevel=info 这个错误原因在于proj这里没有包含对应的task, 可以在这里导入需要的task即可

  2. Part 28 AngularJS default route

    At the moment the problem is that, if you try to navigate to a route that is not configured, you wil ...

  3. 暑假算法练习Day3

    第三天!!!最近要开始归纳总结Python学习啦!! 1006 换个格式输出整数 (15 分) 让我们用字母 B 来表示"百".字母 S 表示"十",用 12. ...

  4. FZU ICPC 2020 寒假训练 4 —— 模拟(一)

    P1042 乒乓球 题目背景 国际乒联现在主席沙拉拉自从上任以来就立志于推行一系列改革,以推动乒乓球运动在全球的普及.其中11分制改革引起了很大的争议,有一部分球员因为无法适应新规则只能选择退役.华华 ...

  5. git修改用户和邮箱

    GIT查看当前用户以及邮箱 $ git config user.name $ git config user.email GIT修改用户以及邮箱 $ git config --global user. ...

  6. 1组-Alpha冲刺-4/6

    一.基本情况 队名:震震带着六菜鸟 组长博客:https://www.cnblogs.com/Klein-Wang/p/15553196.html 小组人数:7人 二.冲刺概况汇报 王业震 过去两天完 ...

  7. 菜鸡的Java笔记 Object 类

    Object 类        Object类 的主要作用        Object 类的常用方法             内容        虽然有了对象的向上转型,可以解决了参数的统一问题,但是 ...

  8. 使用PAM模块实现普通用户之间su免密切换

    参考自:Allow user1 to "su - user2" without password https://unix.stackexchange.com/questions/ ...

  9. python实现色彩空间转换

    目录: (一)调用转换函数实现图像色彩空间转换------ cv2.cvtColor函数 (二)色彩空间转换,利用inrange函数过滤视频中的颜色,实现跟踪某一颜色 正文: (一)调用转换函数实现图 ...

  10. [luogu4331]数字序列

    令$a'_{i}=a_{i}+n-i$.$b'_{i}=b_{i}+n-i$,代价仍然是$\sum_{i=1}^{n}|a'_{i}-b'_{i}|$,但条件变为了$b'_{i}\le b'_{i+1 ...