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

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

news 2025/6/9 12:47:50

请添加图片描述
需求：需求就是实现点击图中的 “抽奖” 按钮，实现一个按钮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

NLP学习路线图（三十二）： 模型压缩与优化

一、 核心压缩与优化技术详解 1. 知识蒸馏：智慧的传承（Knowledge Distillation, KD） 核心思想：“师授徒业”。训练一个庞大、高性能但笨重的“教师模型”（Teacher Model），让其指导训练一个轻量级的“学生模型”（Student Model）。学生模型学习模仿教师模型的输出行为（…...

编程新知 2025/6/9 11:40:55

结合三维基因建模与智能体技术打造工业软件无码平台

通过深度整合 Protocol Buffers (Protobuf)、gRPC 及 Microsoft AI 技术&#xff0c;构建面向智能制造的高性能、智能化 PLM 平台。 一、Protocol Buffers 深度集成 1. 基因模型标准化定义 三维基因容器 Protobuf 规范&#xff1a; protobuf syntax "proto3"; pa…...

编程新知 2025/6/9 9:03:57

基于安卓的文件管理器程序开发研究源码数据库文档

摘 要 伴随着现代科技的发展潮流&#xff0c;移动互联网技术快速发展&#xff0c;各种基于通信技术的移动终端设备做的也越来越好了&#xff0c;现代智能手机大量的进入到了我们的生活中。电子产品的各种软硬技术技术的发展&#xff0c;操作系统的不断更新换代&#xff0c;谷歌…...

编程新知 2025/6/9 7:12:22

Java八股文——MySQL篇

文章目录 Java八股文——MySQL篇慢查询如何定位慢查询&#xff1f;如何分析慢SQLExplain标准答案 索引索引类型索引底层数据结构什么是聚簇索引什么是非聚簇索引&#xff1f;&#xff08;二级索引&#xff09;&#xff08;回表&#xff09;聚集索引选取规则回表查询 什么是覆盖…...

编程新知 2025/6/9 5:42:37

如何使用 HTML、CSS 和 JavaScript 随机更改图片颜色

原文&#xff1a;如何使用 HTML、CSS 和 JavaScript 随机更改图片颜色 | w3cschool笔记 &#xff08;请勿标记为付费&#xff01;&#xff01;&#xff01;&#xff01;&#xff09; 在网页开发中&#xff0c;为图片添加动态效果可以显著提升用户体验。今天&#xff0c;我将向…...

编程新知 2025/6/9 5:01:36

算法训练第十天

232. 用栈实现队列 代码&#xff1a; class MyQueue(object):def __init__(self):self.arr1 []self.arr2 []def push(self, x):""":type x: int:rtype: None"""self.arr1.append(x)def pop(self):""":rtype: int""…...

编程新知 2025/6/9 4:46:04

免费 SecureCRT8.3下载、安装、注册、使用与设置

参考&#xff1a;SecureCRT 8.3中文 安装教程 - Hope - 博客园...

编程新知 2025/6/9 4:22:26

Android 平台RTSP/RTMP播放器SDK接入说明

一、技术背景 自2015年起&#xff0c;大牛直播SDK持续深耕音视频直播领域&#xff0c;自主研发并迭代推出跨平台 RTSP/RTMP 播放模块&#xff0c;具备如下核心优势&#xff1a; 全平台兼容&#xff1a;支持 Android/iOS/Windows/Linux 等主流系统&#xff1b; 超低延迟&#…...

编程新知 2025/6/9 3:42:50

dvwa5——File Upload

LOW 在dvwa里建一个testd2.php文件&#xff0c;写入一句话木马&#xff0c;密码password antsword连接 直接上传testd2.php文件&#xff0c;上传成功 MEDIUM 查看源码&#xff0c;发现这一关只能提交jpg和png格式的文件 把testd2.php的后缀改成jpg&#xff0c;上传时用bp抓包…...

编程新知 2025/6/9 2:22:32

【优选算法】C++滑动窗口

1、长度最小的子数组 思路&#xff1a; class Solution { public:int minSubArrayLen(int target, vector<int>& nums) {// 滑动窗口// 1.left0,right0// 2.进窗口( nums[right])// 3.判断// 出窗口// (4.更新结果)// 总和大于等于 target 的长度最小的 子数组…...

编程新知 2025/6/9 2:18:54