vue实现页面自动滚动,鼠标悬浮暂停,移开继续
1、给div一个id
<div class="kb_nei_new_left" id="chartsContainer">
2、定义一个自动滚动的方法
autoSroll(Id) {// flag 为true时停止滚动var flag = false;// 定时器var timer;function roll() {var h = -1;timer = setInterval(function () {flag = true;//获取当前滚动条高度var current = document.getElementById(Id).scrollTop;if (current == h) {//滚动到底端,返回顶端h = 0;document.getElementById(Id).scrollTop = h + 2;} else {//以25ms/3.5px的速度滚动h = current;document.getElementById(Id).scrollTop = h + 2;}}, 50);}// setTimeout(function() {//鼠标悬浮暂停。document.getElementById(Id).onmouseenter = () => {if (flag) {flag = false;clearInterval(timer);}};//鼠标移开继续document.getElementById(Id).onmouseleave = () => {if (!flag) {flag = true;roll();}};roll();
},
3、在合适的时机调用这个方法
this.autoSroll("chartsContainer");
没有实现滚动效果,可能是绑定id的di选择错了
相关文章:
vue实现页面自动滚动,鼠标悬浮暂停,移开继续
1、给div一个id <div class"kb_nei_new_left" id"chartsContainer">2、定义一个自动滚动的方法 autoSroll(Id) {// flag 为true时停止滚动var flag false;// 定时器var timer;function roll() {var h -1;timer setInterval(function () {flag …...
第3章:文本样式 --[CSS零基础入门]
CSS(层叠样式表)允许你以多种方式定制文本的外观。以下是一些常用的文本和字体相关的CSS属性: 1.字体 字体系列 当然,下面是两个使用不同字体系列的CSS示例。每个示例都展示了如何指定一个字体系列,并提供备用字体以确保在用户的系统中找不到首选字体时仍有合适的字体可…...
从视觉到雷达:多模态感知如何引领自动驾驶安全革命
文章目录 摘要引言多模态感知融合的原理与架构感知技术的特点多模态感知融合的目标 数据融合实现示例代码结构与主要组件模型定义 MultimodalFusionModel前向传播(forward 方法)模型细节剖析实践应用 QA环节总结参考资料 摘要 本文探讨了多模态感知技术…...
若依集成更好用的easyexcel
背景 若依使用的是apach poi并在此基础上进行封装apach poi的原生的api是很复杂的,若依简化了了此操作apach poi的上传速率和下载速率都是没有优化的,依赖于文件大小的限制在此前提下,如果没法满足客户的需求(超大型文件的上传&am…...
大数据新视界 -- 大数据大厂之 Hive 数据导入:多源数据集成的策略与实战(上)(3/ 30)
💖💖💖亲爱的朋友们,热烈欢迎你们来到 青云交的博客!能与你们在此邂逅,我满心欢喜,深感无比荣幸。在这个瞬息万变的时代,我们每个人都在苦苦追寻一处能让心灵安然栖息的港湾。而 我的…...
线段树模板
单点修改 #include <bits/stdc.h> using namespace std; #define IOS ios::sync_with_stdio(false),cin.tie(nullptr); #define rep(i, x, y) for(int i(x), _(y);i<_;i) #define rrep(i, x, y) for(int i(x), _(y);i>_;i--) #define all(x) x.begin(),x.end() #d…...
算法刷题Day15: BM37 二叉搜索树的最近公共祖先
题目链接 描述 给定一个二叉搜索树, 找到该树中两个指定节点的最近公共祖先。 1.对于该题的最近的公共祖先定义:对于有根树T的两个节点p、q,最近公共祖先LCA(T,p,q)表示一个节点x,满足x是p和q的祖先且x的深度尽可能大。在这里,一个节点也可以…...
正则表达式去除文本中括号()<>[]里的内容
一行文本中包含有各种括号,如()、<>、[],我们希望把括号及括号内的内容0去除,可以通过正则表达式来实现。 匹配() pattern r\([^)]*\) # 匹配()匹配一个左括号(,然后匹配0个或多个不是右括号的任意字符[^)]*,…...
Environment Modules安装配置
Environment Modules安装配置 Environment Modules是一款用来管理计算机软件环境的软件,通过简单的命令来控制计算机环境变量。本文接受该软件的安装和配置方法 系统: Linux OpenSUSE 15.6 软件版本: modules 5.5 依赖: gcc 7.5…...
constexpr、const和 #define 的比较
constexpr、const 和 #define 的比较 一、定义常量 constexpr 定义:constexpr用于定义在编译期可求值的常量表达式。示例:constexpr int x 5;这里,x的值在编译期就确定为5。 const 定义:const表示变量在运行期间不能被修改&…...
STM32串口接收与发送(关于为什么接收不需要中断而发生需要以及HAL_UART_Transmit和HAL_UART_Transmit_IT的区别)
一、HAL_UART_Transmit和HAL_UART_Transmit_IT的区别 1. HAL_UART_Transmit_IT(非阻塞模式): HAL_UART_Transmit_IT 是非阻塞的传输函数,也就是说,当你调用 HAL_UART_Transmit_IT 时,它不会等到数据完全发…...
如何制作“优美”PPT
目录 1.免费PPT模板网站: 2.免费有较好质量的图片网站: 免费图片资源 免费透明PNG图片资源: 免费icon图片资源: 3.选择好的图片: 图片底色 4.要与不要 千万不要: 一定要: 6.一些建议…...
5G模组AT命令脚本-控制模组进入飞行模式
控制模组进入飞行模式 控制模组进入飞行模式 控制模组进入飞行模式 控制模组进入飞行模式 #!/bin/bash ## 5G模组采用USB3.0与上位机连接,usb接口在上位机上虚拟出多个port,其中一个可用于发送AT命令,控制模组 ## 本脚本控制模组进入飞行模式## flyin …...
计算机网络-Wireshark探索ARP
使用工具 Wiresharkarp: To inspect and clear the cache used by the ARP protocol on your computer.curl(MacOS)ifconfig(MacOS or Linux): to inspect the state of your computer’s network interface.route/netstat: To inspect the routes used by your computer.Brows…...
Vue 2 生命周期函数详解
Vue 2 生命周期函数详解 引言 Vue.js 是一个渐进式的 JavaScript 框架,用于构建用户界面。理解 Vue 的生命周期函数(Lifecycle Hooks)对于开发高效的 Vue 应用至关重要。本文将详细介绍 Vue 2 的生命周期钩子、每个阶段的作用及其代码示例&…...
Vue的路由实现模式:hash模式和history模式
Vue 路由的两种模式: hash 模式: 类似于住在一个大房子里,你的地址很长,但用一个 “门牌号”(# 后面的部分)来标识你住哪间房间。 例如: bash http://example.com/#/home 这就好比 “example.…...
R语言 | 峰峦图 / 山脊图
目的:为展示不同数据分布的差异。 1. ggplot2 实现 # 准备数据 datmtcars[, c("mpg", "cyl")] colnames(dat)c("value", "type") head(dat) # value type #Mazda RX4 21.0 6 #Mazda RX4 Wag …...
Kubernetes(K8s)
头条:参考资料 Kubernetes 入门指南:从基础到实践_kubernetes 从入门到实践-CSDN博客 Kubernetes(k8s)与docker的区别 Docker、Kubernetes之间的区别_docker和kubernetes区别-CSDN博客 Docker部署SpringBoot项目(镜…...
【代码随想录|贪心算法05】
56.合并区间 题目链接56. 合并区间 - 力扣(LeetCode) 这道题思路跟前两道也很像,就是更新把相同的区间合并而已。 class Solution { public: static bool cmp(const vector<int>& a,const vector<int>& b){return a[0…...
QQ聊天室--C++基础项目--QT+Socket网络编程
目录 一、项目概述 二、项目成果 1、QQ基础界面展示: 2、群聊界面展示: 3、聊天功能展示 三、项目代码 1、登录头文件(denglu.h) 2、登录源文件(denglu.cpp) 3、聊天界面头文件(widget.…...
分布式搜索引擎之elasticsearch基本使用2
分布式搜索引擎之elasticsearch基本使用2 在分布式搜索引擎之elasticsearch基本使用1中,我们已经导入了大量数据到elasticsearch中,实现了elasticsearch的数据存储功能。但elasticsearch最擅长的还是搜索和数据分析。 所以j接下来,我们研究下…...
今日商协丨商协会在“双循环”新发展格局中的作用
在当今全球经济环境中,世界格局正在经历深刻变化,中国正在全面构建“双循环”新发展格局,以实现更高质量、更可持续的发展。在这一过程中,商协会发挥着不可或缺的作用。 商协会在国内大循环中扮演促进者的角色,不仅活…...
前端项目安装node-sass
这个依赖比较难装,因为这个依赖需要安装的版本是和node版本绑定的,所以你需要去sass的官网找到对应关系,下面是我的版本信息: node 16.14.2 node-sass:^6.0.1 sass-loader:^10.2.0 "sass": "^1.82.0", 你…...
算法-字符串-678.有效的括号字符串
一、题目 二、思路解析 1.思路: 用leftMin变量来记录存在的“(”, 用leftMax变量记录字符串中最多的“(” 2.常用方法: 无 3.核心逻辑: 1.遍历字符串: a.当前字符为"(",le…...
linux 压缩文件为zip
在 Linux 系统中,可以使用 zip 命令来压缩文件或目录 打开终端(Terminal)。 使用 cd 命令导航到要压缩的文件或目录所在的路径。 运行以下命令来压缩文件或目录: 压缩单个文件: zip output.zip file.txt这里…...
Cisco Packet Tracer | Cisco Packet Tracer - VLAN 实验 - 交换机的 VLAN 划分
关注这个工具的其它相关笔记:Cisco Packet Tracer —— 使用教程合集-CSDN博客 0x01:VLAN 划分 - 单个交换机 0x0101:拓扑搭建流程 从软件底部拖出一台交换机(笔者选择的型号是 2960 IOS15): 然后再拖出四…...
《计算机网络》(408大题)
2009 路由转发和静态路由的计算 子网划分、路由聚合的计算 注:CIDR中的子网号可以全为0或1,但是其主机号不允许。 注: 这里其实是把到互联网的路由当做了一个默认路由(当一个目的网络地址与路由表中其他都不匹配时,…...
二叉树概述
目录 一、二叉树的基本结构 二、二叉树的遍历 1.前序 2.中序 3.后序 4.层序遍历 三.计算二叉树的相关参数 1.计算节点总个数 2.计算叶子节点的个数 3.计算树的高度 4.计算第k层的子树个数 5.查找树中val为x的节点 四.刷题 1.单值二叉树 2.检查两棵树是否相同 3.一…...
qiankun学习记录
什么是微前端 微前端是指存在于浏览器中的微服务,其借鉴了微服务的架构理念,将微服务的概念扩展到了前端。 如果对微服务的概念比较陌生的话,可以简单的理解为微前端就是将一个大型的前端应用拆分成多个模块,每个微前端模块可以…...
【C++ 20进阶(2):初始化 Initializer
【C 20进阶(2):初始化 Initializer】 原文:https://blog.csdn.net/weixin_44259356/article/details/144377955 引言 本篇文章为系列文章将着重介绍C20新特性,一是希望可以和大家交流分享,二是也便于自己…...
vue3学习——事件监听(v-on)
我们可以使用 v-on 指令监听 DOM 事件: <button v-on:click"increment">{{ count }}</button> 因为其经常使用,v-on 也有一个简写语法: <button click"increment">{{ count }}</button> 此处…...
java全栈day13-后端Web实战2
接上述查询部门实现,完成后续要求 一、统一响应结果 1.1步骤 资料如下 对一开始的代码修改如下 结果如下 1.2测试 指定请求方式 结果 小结 二、前后端联调测试 资料如下: (不行,一定要不带空格和不带中文,要不然启动不了试了半天…...
C++/CX,一个智能的 C++/Windows 平台开发库!
以下是一篇关于C/CX的C学习文章: 开篇 嘿,大家好呀!我是一行。今天咱们来一起探索一个超棒的C开发库——C/CX,它可是在Windows平台开发中非常智能且强大的工具哦,能让我们的开发变得更加高效便捷。让我们一起开启今天的…...
分布式 分布式事务 总结
前言 相关系列 《分布式 & 目录》《分布式 & 分布式事务 & 总结》《分布式 & 分布式事务 & 问题》 分布式事务 所谓分布式事务是指操作范围笼罩多个不同节点的事务。例如对于订单节点&库存节点而言,一次完整的交易需要同时调动两个节…...
数据结构(3)单链表的模拟实现
上一节我们进行了数据结构中的顺序表的模拟式现,今天我们来实现一下另外一个数据结构:单链表。 我们在实现顺序表之后一定会引发一些问题和思考: 1.顺序表在头部和中间插入数据会用到循环,时间复杂O(N) …...
HBU深度学习实验14.5-循环神经网络(1.5)
梯度爆炸实验 造成简单循环网络较难建模长程依赖问题的原因有两个:梯度爆炸和梯度消失。一般来讲,循环网络的梯度爆炸问题比较容易解决,一般通过权重衰减或梯度截断可以较好地来避免;对于梯度消失问题,更加有效的方式…...
Redis01
springbootredis 特点 1.高效性 2.支持多种数据结构 String,list,set,hash.zset 3.稳定性:持久化,主从复制(集群) 4.其他特性:支持过期时间,支持事务,消息订阅。 安装 1.下载安装包 redis官…...
数据库中decimal、float 和 double区别
在计算机科学中,decimal、float 和 double 是用于表示和处理数值的不同数据类型。 - decimal 是一种精确的十进制浮点数表示,通常用于需要高精度计算的场景,比如财务应用。它能够精确表示小数,并且不会出现浮点数运算误差。 - flo…...
HDR视频技术之五:HDR生产流程
在介绍 HDR 的生产流程之前,我们先介绍下视频制作与传输的一些基本知识。 内容类型: 直播内容( live content) ——所谓的直播内容即没有后处理过程以及创作者意图。分发给用户的信息是实时产生并且实时制作并派发的。常见的应用…...
CTFshow-爆破(Web21-28)
CTFshow-爆破(Web21-28) Web21 抓包 选则dic.zip里的字典爆破,记得添加前缀admin: 答案admin:shark63 burp里有一个自定义迭代器,可以设置前几部分,很好用 Web22 题目失效了直接看wp吧 360quake 使用空间搜索引擎—>360quake 搜索语法…...
C++重点和练习
作业题目: #include <iostream> using namespace std; class Rec {const int length;int width; public:void set_length(int l);void set_width(int w);int get_length();int get_width();void show(); };#include <iostream> using namespace std; c…...
UnityShaderLab-实现溶解效果
实现思路: 使用一张噪声图,与一个Cut值计算(加或减),将计算后的值赋值给Alpha,然后小于0的片段就被丢弃掉了。 ShaderGraph实现: ShaderLab实现: Shader "Dissolve" {Properties{_…...
SQLite 数据库学习
1.install sudo apt update sudo apt install sqlitebrowser这是一个开源的图形用户界面工具,专门用于开发、管理和分析 SQLite 数据库。它支持创建或导入导出表、编辑数据、执行 SQL 查询等功能。 2.python 操作数据库 Python 内置了 sqlite3 模块,使…...
【LeetCode: 463. 岛屿的周长 + bfs】
🚀 算法题 🚀 🌲 算法刷题专栏 | 面试必备算法 | 面试高频算法 🍀 🌲 越难的东西,越要努力坚持,因为它具有很高的价值,算法就是这样✨ 🌲 作者简介:硕风和炜,…...
Bean的注入、单例和多例
目录 注入Bean对象 属性注入 构造注入 属性注入专题 注入集合/数组 级联简单类型赋值 Bean的单例和多例 注入Bean对象 简单类型使用value(除Date),非简单类型使用ref 属性注入 name规则:必须提供set方法,去掉set,第一个字…...
java 使用JSqlParser和CCJSqlParser 解析sql
maven <dependency><groupId>com.github.jsqlparser</groupId><artifactId>jsqlparser</artifactId><version>4.9</version> </dependency>解析SQL String sql "select aa,bb from b"; Statement statementCCJSq…...
Anaconda Conda Pip 的区别与联系
在Python生态中,Anaconda、Conda和Pip是三个非常重要的工具,它们在包管理和环境管理方面发挥着关键作用。 Anaconda Anaconda是一个为科学计算而设计的Python发行版,它集成了Conda、Python以及大量的数据科学相关库,如NumPy、Pandas等。Anaconda的主要优势在于它提供了一个…...
总结的一些MySql面试题
目录 一:基础篇 二:索引原理和SQL优化 三:事务原理 四:缓存策略 一:基础篇 1:定义:按照数据结构来组织、存储和管理数据的仓库;是一个长期存储在计算机内的、有组织的、可共享 的…...
【实验15】LSTM的记忆能力实验
目录 1 模型构建 1.1 LSTM层 1.1.1 自定义LSTM算子 1.1.2 nn.LSTM 1.1.3 将自定义LSTM与pytorch内置的LSTM进行对比 1.2 模型汇总 2 模型训练 2.1 训练指定长度的数字预测模型 2.2 多组训练 2.3 损失函数展示 3 模型评价 4 完整代码 5 LSTM模型门状态和单元状态的…...
SSH克隆github项目
1、生成密钥 ssh-keygen -t rsa -C "你的邮箱xxx.com" 全程回车即可(不用输入ras文件名及密码)、为了方便下面的公钥查看 2、配置公钥 查看公钥内容 cat c:\Users\xxx\.ssh\id_rsa.pub(修改为自己的路径及名字) 将公钥内容复制并粘贴至…...