当前位置： 首页 > news >正文

css的active事件在手机端不生效的解决方法

news 2026/5/25 15:46:28

请添加图片描述
需求：需求就是实现点击图中的 “抽奖” 按钮，实现一个按钮Q弹的放大缩小动画

上面是实现的效果，pc端，点击触发 :active

问题：但是这种方式在模拟器上可以，真机H5一调试就没生效了，下面是简单的demo代码

img{width:100px;height:100px;background:red;
}
img:active {animation: shake 1s infinite;animation-iteration-count: 1;
}@keyframes shake {0% {transform: scale(0.98);opacity: 0.9;}50% {transform: scale(1);opacity: 0.7;}100% {transform: scale(1);opacity: 1;}
}

解决方案：在页面body添加一个 ontouchstart=""

没错，就是这么简单

<body ontouchstart="">...
</body>

相关文章：

css的active事件在手机端不生效的解决方法

需求&#xff1a;需求就是实现点击图中的 “抽奖” 按钮&#xff0c;实现一个按钮Q弹的放大缩小动画 上面是实现的效果&#xff0c;pc端&#xff0c;点击触发 :active 问题&#xff1a;但是这种方式在模拟器上可以&#xff0c;真机H5一调试就没生效了&#xff0c;下面是简单…...

编程日记 2024/3/26 1:24:55

00. 认识 Java 语言与安装教程

认识 Java Java 在 20 多年发展过程中&#xff0c;与时俱进&#xff0c;为了适应时代的需要&#xff0c;经历过两次重大的版本升级&#xff0c;一个是 Java 5&#xff0c;它提供了泛型等重要的功能。另一个是提供了 Lambda 表达式等重要的功能的 Java 8。 一些重要的 Java 的…...

编程日记 2024/3/26 1:23:53

数据结构-栈-004

1链栈 1.1栈结点结构体定义 /*定义一个数据结构*/ typedef struct student {char name[32];char sex;int age; }DATA_TYPE;/*定义一个栈结点*/ typedef struct stack_node {DATA_TYPE data;//数据域struct stack_node *pnext;//指针域 }STACK_NODE;1.2栈顶结点结构体定义 /*…...

编程日记 2024/3/26 1:22:52

（第76天）XTTS 升级：11GR2 到 19C

参考文档： 11G - Reduce Transportable Tablespace Downtime using Cross Platform Incremental Backup (Doc ID 1389592.1)V4 使用跨平台增量备份减少可传输表空间的停机时间 (Doc ID 2940565.1)前言 XTTS（Cross Platform Transportable Tablespaces，跨平台迁移表空间）是…...

编程日记 2024/3/26 1:21:51

修改网站源码，给电子商城的商品添加图片时商品id为0的原因

修改网站源码&#xff0c;给电子商城的商品添加图片时商品id为0的原因。花了几个小时查找原因。后来&#xff0c;由于PictureControl.class.php是复制CourseControl.class.php而来&#xff0c;于是对比了这两个文件&#xff0c;在CourseControl.class.php找到了不一样的关键几条…...

编程日记 2024/3/26 1:19:48

ffmpeg开发异步AI推理Filter

ffmpeg开发异步AI推理Filter 1.环境搭建、推理服务及客户端SDK2.编译原版ffmpeg3.测试原版ffmpeg的filter功能4.准备异步推理filter5.修改点6.重新编译ffmpeg7.测试异步推理filter本文旨在阐述如何开发一个FFmpeg Filter，该模块利用gRPC异步通信机制调用远程视频处理服务。这一…...

编程日记 2024/3/26 1:18:47

python与excel第七节 拆分工作簿

一个工作簿中多个工作表拆分为多个工作簿 假设一个excle工作簿中有多个工作表&#xff0c;现在需要将每个工作表拆分为单独的工作簿。 例子&#xff1a; import xlwings as xw# 设置生成文件的路径path D:\\TEST\\dataIn# 源文件的路径workbook_name D:\\TEST\\dataIn\\产…...

编程日记 2024/3/26 1:16:45

JS08-DOM节点完整版

DOM节点 查找节点 父节点 <div class="father"><div class="son">儿子</div></div><script>let son = document.querySelector(.son)console.log(son.parentNode);son.parentNode.style.display = none</script>通过…...

编程日记 2024/3/26 1:14:43

【python】python3基础

文章目录 一、安装pycharm 二、输入输出输出 print()文件输出&#xff1a;格式化输出&#xff1a; 输入input注释 三、编码规范四、变量保留字变量 五、数据类型数字类型整数浮点数复数 字符串类型布尔类型序列结构序列属性列表list &#xff0c;有序多维列表列表推导式 元组tu…...

编程日记 2024/3/26 1:13:42

计算机三级网络技术 选择+大题234笔记

上周停去准备计算机三级的考试啦&#xff0c;在考场上看到题目就知道这次稳了&#xff01;只有一周的时间&#xff0c;背熟笔记&#xff0c;也能稳稳考过计算机三级网络技术&#xff01;...

编程日记 2024/3/26 1:12:40

智能合约 之 ERC-721

ERC-721&#xff08;Non-Fungible Token&#xff0c;NFT&#xff09;标准 ERC-721是以太坊区块链上的一种代币标准&#xff0c;它定义了一种非同质化代币&#xff08;Non-Fungible Token&#xff0c;NFT&#xff09;的标准。NFT是一种加密数字资产&#xff0c;每个代币都具有独…...

编程日记 2024/3/26 1:11:39

== 和 equals 的区别是什么？

和 equals() 在 Java 中都是用于比较两个对象&#xff0c;但它们之间存在显著的差异&#xff1a; 比较的内容&#xff1a; &#xff1a;这是 Java 中的基本比较运算符&#xff0c;对于基本数据类型&#xff08;如 int, char, double 等&#xff09;&#xff0c;它比较的是值&a…...

编程日记 2024/3/26 1:09:37

VUE:内置组件＜Teleport＞妙用

一、<Teleport>简介 <Teleport>能将其插槽内容渲染到 DOM 中的另一个位置。也就是移动这个dom。 我们可以这么使用它: 将class为boxB的盒子移动到class为boxA的容器中。 <Teleport to".boxA"><div class"boxB"></div> &…...

编程日记 2024/3/26 1:08:36

ruoyi-nbcio-plus后端里mapstruct-plus和lombok的使用

更多ruoyi-nbcio功能请看演示系统 gitee源代码地址 前后端代码&#xff1a; https://gitee.com/nbacheng/ruoyi-nbcio 演示地址&#xff1a;RuoYi-Nbcio后台管理系统 http://122.227.135.243:9666/ 更多nbcio-boot功能请看演示系统 gitee源代码地址 后端代码&#xff1a…...

编程日记 2024/3/26 1:06:35

企业如何选择一个开源「好」项目？

开源 三句半​​​​​​​ 需求明确是关键 风险考量要周全 开源虽好不白捡 别忘合规&#xff01; 显然&#xff0c;开源已成为一股不可阻挡的洪流&#xff0c;企业拥抱开源&#xff0c;积极参与开源项目不仅是响应技术潮流的必然选择&#xff0c;更是实现自身技术创新、市场拓…...

编程日记 2024/3/26 1:05:34

c++算法学习笔记 (14) 并查集

1.合并集合 一共有 n 个数&#xff0c;编号是 1∼n&#xff0c;最开始每个数各自在一个集合中。 现在要进行 m 个操作&#xff0c;操作共有两种&#xff1a; M a b&#xff0c;将编号为 a 和 b 的两个数所在的集合合并&#xff0c;如果两个数已经在同一个集合中&#xff0c;…...

编程日记 2024/3/26 1:04:33

import * as的使用

import * as 是将一个模块的所有导出内容作为一个命名空间对象导入到当前模块中&#xff0c;其中 * 表示导入该模块中的所有导出内容&#xff0c;而 as 则用于指定导入的命名空间对象的名称。 例如&#xff1a;在 formatter 文件中有两个方法导出 const a () > {console.…...

编程日记 2024/3/26 1:03:32

微服务（基础篇-003-Nacos）

目录 Nacos注册中心&#xff08;1&#xff09; 认识和安装Nacos&#xff08;1.1&#xff09; Nacos快速入门&#xff08;1.2&#xff09; 服务注册到Nacos(1.2.1) Nacos服务分级存储模型&#xff08;1.3&#xff09; 配置集群&#xff08;1.3.1&#xff09; 根据集群修改…...

编程日记 2024/3/26 1:00:29

java数据结构与算法刷题-----LeetCode215. 数组中的第K个最大元素

java数据结构与算法刷题目录&#xff08;剑指Offer、LeetCode、ACM&#xff09;-----主目录-----持续更新(进不去说明我没写完)&#xff1a;https://blog.csdn.net/grd_java/article/details/123063846 文章目录 解题思路&#xff1a;时间复杂度O( n n n)&#xff0c;空间复杂度…...

编程日记 2024/3/26 0:57:25

Springboot 整合 Knife4j （API文档生成工具）

目录 一、Knife4j 介绍 二、Springboot 整合 Knife4j 1、pom.xml中引入依赖包 2、在application.yml 中添加 Knife4j 相关配置 3、打开 Knife4j UI界面 三、关于Knife4j框架中常用的注解 1、Api 2、ApiOperation ​3、ApiOperationSupport(order X) ​4、ApiImplici…...

编程日记 2024/3/26 0:54:23

YesCaptcha插件+DdddOCR实战：为无障碍测试或自动化脚本打造免费验证码解决方案

YesCaptcha插件DdddOCR实战&#xff1a;为无障碍测试或自动化脚本打造免费验证码解决方案验证码作为网络安全的重要防线&#xff0c;却常常成为自动化流程和无障碍访问的"拦路虎"。传统解决方案要么成本高昂&#xff0c;要么识别率不稳定。本文将揭示如何通过YesCapt…...

编程新知 2026/5/25 12:53:00

别再死记硬背公式了！用UE5的Lerp节点玩转材质混合（附灰度图实战案例）

别再死记硬背公式了&#xff01;用UE5的Lerp节点玩转材质混合&#xff08;附灰度图实战案例&#xff09;在游戏开发中&#xff0c;材质混合是创造丰富视觉效果的关键技术。对于Unreal Engine 5的初学者来说&#xff0c;LinearInterpolate&#xff08;简称Lerp&#xff09;节点可…...

编程新知 2026/5/25 12:46:49

ChatGPT自动回复失效真相：微信API接口变更后，必须重写的4段核心Prompt代码（含防封逻辑）

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;ChatGPT公众号运营技巧 在微信生态中&#xff0c;将ChatGPT能力深度融入公众号运营&#xff0c;需兼顾合规性、用户体验与自动化效率。微信官方明确禁止直接调用外部AI接口响应用户消息&#xff08;如透…...

编程新知 2026/5/25 11:29:19

九大网盘直链解析工具：如何让文件传输效率提升300%以上

九大网盘直链解析工具&#xff1a;如何让文件传输效率提升300%以上 【免费下载链接】Online-disk-direct-link-download-assistant 一个基于 JavaScript 的网盘文件下载地址获取工具。基于【网盘直链下载助手】修改 &#xff0c;支持 百度网盘 / 阿里云盘 / 中国移动云盘 / 天翼…...

编程新知 2026/5/25 11:23:44

终极Windows Office激活指南：如何一键永久解决系统激活烦恼

终极Windows Office激活指南&#xff1a;如何一键永久解决系统激活烦恼 【免费下载链接】KMS_VL_ALL_AIO Smart Activation Script 项目地址: https://gitcode.com/gh_mirrors/km/KMS_VL_ALL_AIO 还在为Windows和Office激活问题而烦恼吗&#xff1f;每次重装系统后都要四…...

编程新知 2026/5/25 11:13:03

构建全栈可解释AI框架：从数据到决策的透明化实践

1. 项目概述&#xff1a;为什么我们需要一个“全栈”可解释AI框架&#xff1f; 在医疗诊断、金融风控、自动驾驶这些领域&#xff0c;一个AI模型给出的“是”或“否”的答案&#xff0c;往往只是一个决策的起点&#xff0c;而非终点。医生需要知道模型是基于哪些影像特征判断出…...

编程新知 2026/5/25 6:54:43

【AI搜索引擎未来5年趋势白皮书】：20位顶尖AI架构师联合预测的7大不可逆变革

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;AI搜索引擎未来5年趋势总览 AI搜索引擎正从关键词匹配的“检索工具”加速演进为具备推理能力、上下文感知与主动服务意识的“智能认知中枢”。未来五年&#xff0c;其技术演进将围绕多模态理解、实时知…...

编程新知 2026/5/25 5:45:07

2026年降AI后语义失真攻略：过度改写论点跑偏4.8元修复语义同时达标完整方案

2026年降AI后语义失真攻略&#xff1a;过度改写论点跑偏4.8元修复语义同时达标完整方案 从AI率71%到5.9%&#xff0c;我用了一个晚上。降AI后语义失真修复完整经历。 核心工具&#xff1a;嘎嘎降AI&#xff08;www.aigcleaner.com&#xff09;&#xff0c;4.8元&#xff0c;达…...

编程新知 2026/5/25 5:11:17

不止于播放：用VideoPlayer脚本控制实现一个简易的Unity视频播放器UI

不止于播放&#xff1a;用VideoPlayer脚本控制实现一个简易的Unity视频播放器UI在Unity中构建一个功能完整的视频播放器UI&#xff0c;远不止简单地调用VideoPlayer.Play()这么简单。本文将带您从零开始&#xff0c;实现一个具备播放控制、进度条拖拽、音量调节等完整功能的视频…...

编程新知 2026/5/25 4:10:29

Unity中RVO避障原理与抖动根治实战

1. 为什么NPC一靠近就“抽风”&#xff1f;这不是Bug&#xff0c;是RVO没吃透在Unity里做群体AI时&#xff0c;你肯定见过这种场景&#xff1a;十几个NPC排着队往目标点走&#xff0c;刚走到拐角或窄道&#xff0c;队伍突然像被按了快进键——有的原地打转&#xff0c;有的疯狂…...

编程新知 2026/5/25 4:08:26