js 长按鼠标左键实现溢出内容左右滚动滚动
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 长按鼠标左键实现溢出内容左右滚动滚动的更多相关文章
- js 鼠标左键拖动滚动
鼠标左键拖动滚动 原作者: http://blog.csdn.net/lisatisfy/article/details/6606026 本文在源代码的基础上 增加支持水平滚动 的功能 html &l ...
- js进阶 12-17 jquery实现鼠标左键按下拖拽功能
js进阶 12-17 jquery实现鼠标左键按下拖拽功能 一.总结 一句话总结:监听的对象必须是文档,鼠标按下运行mousemove事件,鼠标松开取消mousemove事件的绑定,div的偏移的话是 ...
- 【转】 js怎么区分出点击的是鼠标左键还是右键?
IE 下 onMouseDown 事件有个 events.button 可以返回一个数值,根据数值判断取得用户按了那个鼠标键 events.button==0 默认.没有按任何按钮. events. ...
- Swing中如何比较好的判断鼠标左键双击
import java.awt.Toolkit; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; im ...
- Vue 监听鼠标左键 鼠标右键以及鼠标中键修饰符click.left&contextmenu&click.middle
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ctrl+鼠标左键监听
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- C# GDI绘制矩形框,鼠标左键拖动可移动矩形框,滚轮放大缩小矩形框
最近工作需要,要做一个矩形框,并且 用鼠标左键拖动矩形框移动其位置.网上查了一些感觉他们做的挺复杂的.我自己研究一天,做了一个比较简单的,发表出来供大家参考一下.如觉得简单,可路过,谢谢.哈哈. 先大 ...
- zend studio中ctrl+鼠标左键无法转到类或函数定义文件的解决方法
转载自:http://blog.csdn.net/wide288/article/details/21622183 zend studio中ctrl+鼠标左键无法转到类或函数定义文件的解决方法: ze ...
- [Eclipse] eclipse中打开xml文件,使用ctrl+鼠标左键无法跳转至Java源文件【待解决】
eclipse中打开xml文件,使用ctrl+鼠标左键无法跳转至Java源文件: 1. 设置eclipse ctrl + 左键打开源文件代码,如下图,设置都正常 2. 在网上找了很多种办法,均失败,在 ...
随机推荐
- 运行脚本 结果出现 Vim: Warning 并且卡住不能输入其它命令
当我在执行一个 关于执行linux操作的php脚本时,就出现了以下信息:"Vim: Warning: Output is not to a terminal",接着出现了一大堆的字 ...
- 全球首发-基于.NET 6长线支持Zoomla!逐浪CMS v8.6.0正式发布
传送门: https://www.z01.com/down/3778.shtml 全新Zoomla!逐浪CMS v8.6.0 全于首个基于.net 6长线支持的CMS-Zoomla!逐浪CMS v8. ...
- 体验用yarp连接websocket
前段时间一看yarp的仓库,wow,终于发布1.0版本了..net也升级到6版本了,之前一直只是用yarp做HTTP转发,今天刚好试试websocket 话不多说,直接开搞 配置集群 首先先配置集群信 ...
- Netcat基础使用
netcat命令选项 本文参考文章链接 本文参考文章链接1 本文参考文章链接2 本文参考文章链接3 常用命令选项 ## 网络模式和代理相关 -l 监听,作服务器.不填时作客户端. -u UDP模式.不 ...
- 90-95年CPU功耗感知调度研究
最近读了三篇1990-1995年的通过调度来降低cpu能耗的文章[1] [2] [3],简单总结一下该年代单核CPU功耗感知的调度策略. Motivation 随着便携式设备逐渐兴起,人们对降低其功耗 ...
- Unity Ioc 类型初始值设定项引发异常,The type name or alias SqlServer could not be resolved. Please check your configuration file and verify this type name.
先看一下unity的配置信息 <unity> <typeAliases> <typeAlias alias="IDatabase" type=&quo ...
- [bzoj5338]xor
维护两颗可持久化字典树(当然可以放在一起),第一棵维护每一个点到根的每一位的二进制数量,在其父亲的基础上建立:第二棵维护dfs序上每一个点到第1个点的二进制数量,在其上一个点的基础上建立. 对于询问1 ...
- ICCV2021 | Swin Transformer: 使用移位窗口的分层视觉Transformer
前言 本文解读的论文是ICCV2021中的最佳论文,在短短几个月内,google scholar上有388引用次数,github上有6.1k star. 本文来自公众号CV技术指南的论文分享系 ...
- 最难忘的一次bug:谢谢实习时候爱学习的自己
前言 时间的车轮一直向前不停,试图在时光洪流中碾碎一些久远的记忆.虽然记忆中的人离我越来越远,但是故事却越来越深刻. 当在博客园看到这次的正文题目是"最难忘的bug",脑海里瞬间浮 ...
- 洛谷 P3214 - [HNOI2011]卡农(线性 dp)
洛谷题面传送门 又是一道我不会的代码超短的题( 一开始想着用生成函数搞,结果怎么都搞不粗来/ll 首先不妨假设音阶之间存在顺序关系,最终答案除以 \(m!\) 即可. 本题个人认为一个比较亮的地方在于 ...