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. Charles抓包 mock数据和rewrite功能

    一.mock数据 mock:在后端返回异常或需要=改前端展示的数据时可以模拟返回的response 1.1 抓到接口后 右击保存response到本地,后缀改成.json打开可以看到是把json保存下 ...

  2. Spring @Component生成bean名称的规则(当类的名字是以两个或以上的大写字母开头的话,bean的名字会与类名保持一致

    正确注入方式: @Autowired private TFeeMapper TFeeMapper; 错误注入方式 @Autowired private TFeeMapper tFeeMapper; 这 ...

  3. ARM汇编解决阶乘以及大小写转换

    环境以及硬件 一.硬件仿真基于 SAMSUNG's S3C44B0X 16/32-bit RISC microprocessor 芯片,仿真器为 J-LINK 二.编写指令软件为 Integrated ...

  4. Django笔记&教程 6-4 forms进阶操作,重写forms方法

    Django 自学笔记兼学习教程第6章第4节--forms进阶操作,重写forms方法 点击查看教程总目录 1 - 重写clean方法 在本章第三节中,我们举了个注册学生账号的例子,里面我们使用模型来 ...

  5. python有关于图像的深度和通道

    目录: (一)图像的深度和图像的通道  (1)图像的深度  (2)图像的通道 (二)自定义一张多通道的图片 (1)zeros 函数 (2)ones  函数 (三)自定义一张单通道的图片 (四)像素操作 ...

  6. PHP绕过MD5比较的各种姿势

    1.用==进行弱类型比较时, 可以通过两个0e开头后面纯数字的md5绕过 php在进行弱类型比较时,如果为字符串为纯数字,包括浮点数.科学计数法.十六进制数等,都会转化为数字类型再进行比较,利用这点, ...

  7. Protocol Buffer序列化Java框架-Protostuff

    了解Protocol Buffer 首先要知道什么是Protocol Buffer,在编程过程中,当涉及数据交换时,我们往往需要将对象进行序列化然后再传输.常见的序列化的格式有JSON,XML等,这些 ...

  8. 最强最全面的Hive SQL开发指南,超四万字全面解析

    本文整体分为两部分,第一部分是简写,如果能看懂会用,就直接从此部分查,方便快捷,如果不是很理解此SQL的用法,则查看第二部分,是详细说明,当然第二部分语句也会更全一些! 第一部分: hive模糊搜索表 ...

  9. CF1539F Strange Array

    这玩意为啥是紫. 考虑对每个小于\(x\)的数值设为1,大于\(x\)的数值设为-1. 那么对于答案要求的就是绝对值最大的连续段. 线段树是很显然的. 考虑我们不能对每个数都进行一遍重构,这样就退化到 ...

  10. Codeforces 639E - Bear and Paradox(二分+贪心)

    Codeforces 题目传送门 & 洛谷题目传送门 原来 jxd 作业里也有我会做的题 i 了 i 了 首先这种题目的套路就是先考虑对于一个固定的 \(c\),怎样求出得分最高的策略,而类似 ...