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. 为 Android 编译并集成 FFmpeg 的尝试与踩坑

    前言与环境说明 随着 FFmpeg.NDK 与 Android Studio 的不断迭代,本文可能也会像我参考过的过期文章一样失效(很遗憾),但希望本文中提到的问题排查以及步骤说明能够帮到你,如果发现 ...

  2. 为什么建议使用你 LocalDateTime ,而不是 Date?

    在项目开发过程中经常遇到时间处理,但是你真的用对了吗,理解阿里巴巴开发手册中禁用static修饰SimpleDateFormat吗 通过阅读本篇文章你将了解到: 为什么需要LocalDate.Loca ...

  3. 『与善仁』Appium基础 — 8、Appium自动化测试框架介绍

    目录 1.主流的移动端自动化测试框架 (1)Robotium (2)Macaca (3)Appium 2.自动化测试工具的选择 3.Appium简介 提示:我们前面说的Android环境搭建和adb命 ...

  4. string类运用:特殊的翻译

    特殊的翻译 小明的工作是对一串英语字符进行特殊的翻译:当出现连续且相同的小写字母时,须替换成该字母的大写形式,在大写字母的后面紧跟该小写字母此次连续出现的个数:与此同时,把连续的小写字母串的左侧和右侧 ...

  5. linux python2.6.6升级到python2.7

    升级 python 2.6.6 系统到 2.7.10 版本 CentOS 6 系统默认 Python 版本是:2.6.6 平时在使用中遇到很多的库要求是 2.7.x 版本的库,比如使用 ConfigP ...

  6. [loj6033]棋盘游戏

    将棋盘黑白染色,即构成一张二分图 将状态用一张二分图$G$和一个点$x\in V$描述(分别为仍未被经过的点的导出子图和当前棋子所在位置),并称将要移动棋子的一方为先手 结论:先手必胜当且仅当$x$一 ...

  7. [hdu7099]Just Another Data Structure Problem

    不难发现,问题即求满足以下条件的$(i,j)$对数: 1.$1\le i<j\le n$且$a_{i}=a_{j}$ 2.$\min_{i\le k\le j}y_{k}\ge l$且$\max ...

  8. [hdu6134]Battlestation Operational

    1 #include<bits/stdc++.h> 2 using namespace std; 3 #define mod 1000000007 4 #define N 1000005 ...

  9. [atARC112F]Die Siedler

    1和2操作是独立的,换言之一定可以先执行1操作选择包裹,再执行2操作使得$0\le c_{i}<2i$ 对于$c_{i}$,将其看作一个进制转换,并以$c_{i}$为从低到高的第$i$位,系数即 ...

  10. C/C++ Qt TreeWidget 单层树形组件应用

    TreeWidget 目录树组件,该组件适用于创建和管理目录树结构,在开发中我们经常会把它当作一个升级版的ListView组件使用,因为ListView每次只能显示一列数据集,而使用TableWidg ...