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

JavaScript实现广告倒计时和跳过广告

news 2026/2/8 20:58:44

倒计时和跳过广告

最近打开手机上的app，映入眼帘的都是一个几秒的广告，带有倒计时，当然如果不喜欢的话可以点击跳过，跳过广告其实质应该就是关闭广告。以前用JavaScript做过一个定时关闭的广告，于是把代码完善了一下，加上倒计时效果和实现跳过部分的代码。
在这里插入图片描述

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title>定时关闭的广告</title><style type="text/css">.main img {width: 100%;}.adv {position: absolute;z-index: 9;width: 616px;height: 395px;top: 0;left: 0;bottom: 0;right: 0;margin: auto;}.adv .right {position: absolute;right:0;top:10px;font-size: 14px;color:#fff;cursor: pointer;background-color: #333;border-radius: 10px;width: 80px;height: 30px;line-height: 30px;text-align: center;}</style></head><body><div class="main"><img src="images/gugong.png"></div><div class="adv"><div class="right"><span id="counting">5</span>秒跳过</div><div><img src="images/adv.png" alt=""></div></div><script>//关闭广告窗口function closeAdv() {document.querySelector('.adv').style.display = "none";}//秒数var seconds = document.querySelector("#counting").innerText;//定义倒计时函数function countDown() {seconds--;document.querySelector("#counting").innerText = seconds;}var count = setInterval(countDown, 1000)//每隔一秒检查一次秒数是否为0，若为0，关闭广告窗口，清除定时器setInterval(function() {if (seconds == 0) {closeAdv();clearInterval(count);}}, 1000)//点击跳过，关闭广告窗口var skip = document.querySelector('.right');skip.addEventListener('click',closeAdv)</script></body>
</html>

相关文章：

JavaScript实现广告倒计时和跳过广告

倒计时和跳过广告 最近打开手机上的app&#xff0c;映入眼帘的都是一个几秒的广告&#xff0c;带有倒计时&#xff0c;当然如果不喜欢的话可以点击跳过&#xff0c;跳过广告其实质应该就是关闭广告。以前用JavaScript做过一个定时关闭的广告&#xff0c;于是把代码完善了一下&…...

编程日记 2023/9/9 14:18:03

蚂蚁发布金融大模型：两大应用产品支小宝2.0、支小助将在完成备案后

9月8日&#xff0c;在上海举办的外滩大会上&#xff0c;蚂蚁集团正式发布金融大模型。据了解&#xff0c;蚂蚁金融大 模型基于蚂蚁自研基础大模型&#xff0c;针对金融产业深度定制&#xff0c;底层算力集群达到万卡规模。该大 模型聚焦真实的金融场景需求&#xff0c;在“认知…...

编程日记 2023/9/9 14:17:01

Jenkins 持续集成：Linux 系统 两台机器互相免密登录

背景知识 我们把public key放在远程系统合适的位置&#xff0c;然后从本地开始进行ssh连接。 此时&#xff0c;远程的sshd会产生一个随机数并用我们产生的public key进行加密后发给本地&#xff0c;本地会用private key进行解密并把这个随机数发回给远程系统。 最后&#xf…...

编程日记 2023/9/9 14:16:00

Golang-GJSON 快速而简单的方法来从 json 文档获取值

GJSON 是一个 Go 包&#xff0c;它提供了一种快速而简单的方法来从 json 文档获取值。它具有单行搜索、点符号路径、迭代和解析 json 行等功能。 GJSON 也可用于Python和Rust 入门 安装中 要开始使用GJSON 请安装 Go 并运行 go get &#xff1a; $ go get -u github.com/ti…...

编程日记 2023/9/9 14:14:59

echarts根据x轴数据长度判断是否倾斜展示/柱状图上方显示数字

showChart1() { // 通过id初始化let chart1 echarts.init(document.getElementById(this.idName))var option {// 到容器的距离grid: {top: 18,left: 0,right: 4,bottom: 0,},xAxis: [{type: category,data: this.xData,axisLine: {lineStyle: {color: rgba(255, 255, 255, .…...

编程日记 2023/9/9 14:13:58

Eviews用向量自回归模型VAR实证分析公路交通通车里程与经济发展GDP协整关系时间序列数据和脉冲响应可视化...

全文下载链接&#xff1a;http://tecdat.cn/?p27784 河源市是国务院1988年1月7日批准设立的地级市&#xff0c;为了深入研究河源市公路交通与经济发展的关系&#xff0c;本文选取了1988&#xff0d;2014年河源市建市以来24年的地区生产总值&#xff08;GDP&#xff09;和公路通…...

编程日记 2023/9/9 14:12:55

群晖NAS：通过Docker 部署宝塔面板【注册表：cyberbolt/baota】

群晖NAS&#xff1a;通过 Docker 部署宝塔面板【注册表&#xff1a;pch18/baota】 由于 docker 源地址被墙&#xff0c;在面板里面查询不到注册表&#xff0c;使用 ssh 命令行拉取 1、打开 SSH&#xff0c;链接后打开命令行 这里不赘述&#xff0c;具体自行百度 2、下载 镜像…...

编程日记 2023/9/9 14:11:54

pdfjs在线预览组件的使用

前言 pdfjs在线预览组件。 原生浏览器预览pdf文件&#xff0c;存在pdf xss跨站攻击风险。推荐使用pdfjs第三方组件在线预览pdf文件。 如何使用 下载 官方插件下载地址&#xff1a;https://mozilla.github.io/pdf.js/getting_started/ 安装 把下载的文件复制到项目中 使用pd…...

编程日记 2023/9/9 14:10:53

python线程、协程

线程 创建线程对象 from threading import Threadt Thread() # 功能&#xff1a;创建线程对象 # 参数&#xff1a;target 绑定线程函数 # args 元组 给线程函数位置传参 # kwargs 字典 给线程函数键值传参启动线程 t.start() # 启动线程回收线程 t.join([timeout]) # …...

编程日记 2023/9/9 14:09:52

AttributeError: module ‘OpenSSL.SSL’ has no attribute ‘SSLv3_METHOD

这个错误是由于在OpenSSL.SSL模块中找不到SSLv3_METHOD属性导致的。解决这个问题的方法如下&#xff1a; 首先&#xff0c;确保你已经安装了最新版本的cryptography和pyOpenSSL。你可以使用以下命令卸载并重新安装它们&#xff1a; 卸载cryptography&#xff1a;pip uninstall …...

编程日记 2023/9/9 14:08:51

DTCC 2023丨云原生环境下，需要什么样的 ETL 方案？

​2023年8月16日~18日&#xff0c;第14届中国数据库技术大会&#xff08;DTCC 2023&#xff09;于北京隆重召开&#xff0c;拓数派受邀参与本次大会&#xff0c;PieCloudDB 技术专家邱培峰在大会做了《云原生虚拟数仓 PieCloudDB ETL 方案设计与实现》的主题演讲&#xff0c;详…...

编程日记 2023/9/9 14:07:49

在UE4虚幻引擎中加入导航网格体边界体积后丧尸不能移动和发现玩家

UE4系列文章目录 文章目录 UE4系列文章目录前言一、用到的知识点二、问题原因 前言 最近使用ue4做第一人称视角射击游戏发现问题&#xff0c;加入导航网格体边界体积后丧尸不能移动和发现玩家。下图是出现的问题图片 一、用到的知识点 1.行为树&#xff1a;控制并显示AI的决…...

编程日记 2023/9/9 14:06:49

华为数通方向HCIP-DataCom H12-821题库(单选题：221-240)

第201题 BGP 协议用​​ beer default-route-advertise​​ 命令来给邻居发布缺省路由,那么以下关于本地 BGP 路由表变化的描述，正确的是哪一项? A、在本地 BGP 路由表中生成一条活跃的缺省路由并下发给路由表 B、在本地 BGP 路由表中生成一条不活跃的缺省路由，但不下发给…...

编程日记 2023/9/9 14:05:48

aarch64 arm64 部署 stable diffusion webui 笔记 【1】准备 venv 安装pytorch 验证cuda

aarch64 pytorch(没有aarch64对应版本&#xff0c;自行编译) pytorch-v2.0.1 cuda arm64 aarch64 torch 2.0.1cu118 源码编译笔记【2】验证cuda安装 成功_hkNaruto的博客-CSDN博客 创建venv [rootceph3 stable-diffusion-webui]# /usr/local/Python-3.10.12/bin/python3 -m v…...

编程日记 2023/9/9 14:04:47

从方法到目标了解什么是机器学习？

一、什么是机器学习 1、简述 机器学习是 人工智能（AI） 和计算机科学的一个分支，专注于利用数据和算法来模仿人类的学习方式，逐步提高其准确性。过去几十年来，存储和处理能力方面的技术进步催生了一些基于机器学习的创新产品，例如 Netflix 的推荐引擎和自动驾驶汽车。 机…...

编程日记 2023/9/9 14:03:43

Devos勒索病毒：网络安全的新威胁，勒索病毒解密，数据恢复

随着信息技术的飞速发展&#xff0c;网络安全问题日益凸显。近年来&#xff0c;一种名为Devos的勒索病毒在全球范围内肆虐&#xff0c;给企业和个人带来了极大的损失。本文将详细介绍Devos勒索病毒的特点、传播途径以及预防和应对措施&#xff0c;帮助大家更好地认识和防范这一…...

编程日记 2023/9/9 14:02:42

go语言的高级特性

go语言调用C语言 go tool cgo main.go...

编程日记 2023/9/9 14:01:42

华为VRP系统基本操作

1.实验目的 掌握一些常见的路由命令。 2.实验步骤 查看设备版本信息 display version 修改设备的名字 进入系统视图 system-view修改设备名称 sysname Datacom-Router进入接口视图 int g0/0/1进入到接口GigabitEthernet0/0/1的视图 interface GigabitEthernet 0/0/1dis…...

编程日记 2023/9/9 14:00:40

Milvus Cloud扩展变更：为向量数据库注入前沿增强功能

在向量数据库的不断变化中，Milvus Cloud已成为一个改变游戏规则的先锋，革新了我们存储、搜索和分析复杂向量数据的方式。通过最新版本的Milvus Cloud2.3.0，引入了一系列重要的增强和修改，为更强大、更高效的向量数据库解决方案铺平了道路。在本文中，我们将深入探讨Milvus …...

编程日记 2023/9/9 13:59:39

外观模式简介

概念&#xff1a; 外观模式&#xff08;Facade Pattern&#xff09;是一种结构型设计模式&#xff0c;它提供了一个统一的接口&#xff0c;用于访问子系统中的一组接口。外观模式隐藏了子系统的复杂性&#xff0c;并将其封装在一个简单易用的接口中&#xff0c;使得客户端可以…...

编程日记 2023/9/9 13:58:38

8k长序列建模，蛋白质语言模型Prot42仅利用目标蛋白序列即可生成高亲和力结合剂

蛋白质结合剂&#xff08;如抗体、抑制肽&#xff09;在疾病诊断、成像分析及靶向药物递送等关键场景中发挥着不可替代的作用。传统上&#xff0c;高特异性蛋白质结合剂的开发高度依赖噬菌体展示、定向进化等实验技术&#xff0c;但这类方法普遍面临资源消耗巨大、研发周期冗长…...

编程新知 2026/1/25 13:18:12

如何在看板中有效管理突发紧急任务

在看板中有效管理突发紧急任务需要&#xff1a;设立专门的紧急任务通道、重新调整任务优先级、保持适度的WIP&#xff08;Work-in-Progress&#xff09;弹性、优化任务处理流程、提高团队应对突发情况的敏捷性。其中&#xff0c;设立专门的紧急任务通道尤为重要&#xff0c;这能…...

编程新知 2026/2/3 22:50:06

Neo4j 集群管理：原理、技术与最佳实践深度解析

Neo4j 的集群技术是其企业级高可用性、可扩展性和容错能力的核心。通过深入分析官方文档，本文将系统阐述其集群管理的核心原理、关键技术、实用技巧和行业最佳实践。 Neo4j 的 Causal Clustering 架构提供了一个强大而灵活的基石，用于构建高可用、可扩展且一致的图数据库服务…...

编程新知 2025/12/27 16:43:24

vue3 定时器-定义全局方法 vue+ts

1.创建ts文件 路径&#xff1a;src/utils/timer.ts 完整代码&#xff1a; import { onUnmounted } from vuetype TimerCallback (...args: any[]) > voidexport function useGlobalTimer() {const timers: Map<number, NodeJS.Timeout> new Map()// 创建定时器con…...

编程新知 2025/8/9 0:31:20

C++.OpenGL （10/64）基础光照（Basic Lighting）

基础光照（Basic Lighting） 冯氏光照模型（Phong Lighting Model） #mermaid-svg-GLdskXwWINxNGHso {font-family:"trebuchet ms",verdana,arial,sans-serif;font-size:16px;fill:#333;}#mermaid-svg-GLdskXwWINxNGHso .error-icon{fill:#552222;}#mermaid-svg-GLd…...

编程新知 2026/1/20 2:37:04

docker 部署发现spring.profiles.active 问题

报错&#xff1a; org.springframework.boot.context.config.InvalidConfigDataPropertyException: Property spring.profiles.active imported from location class path resource [application-test.yml] is invalid in a profile specific resource [origin: class path re…...

编程新知 2025/9/20 12:14:18

嵌入式学习笔记DAY33（网络编程——TCP）

一、网络架构 C/S &#xff08;client/server 客户端/服务器&#xff09;&#xff1a;由客户端和服务器端两个部分组成。客户端通常是用户使用的应用程序&#xff0c;负责提供用户界面和交互逻辑 &#xff0c;接收用户输入&#xff0c;向服务器发送请求&#xff0c;并展示服务…...

编程新知 2026/2/7 11:00:30

深入理解Optional：处理空指针异常

1. 使用Optional处理可能为空的集合 在Java开发中&#xff0c;集合判空是一个常见但容易出错的场景。传统方式虽然可行&#xff0c;但存在一些潜在问题&#xff1a; // 传统判空方式 if (!CollectionUtils.isEmpty(userInfoList)) {for (UserInfo userInfo : userInfoList) {…...

编程新知 2025/12/19 19:15:39

通过 Ansible 在 Windows 2022 上安装 IIS Web 服务器

拓扑结构 这是一个用于通过 Ansible 部署 IIS Web 服务器的实验室拓扑。 前提条件&#xff1a; 在被管理的节点上安装WinRm 准备一张自签名的证书 开放防火墙入站tcp 5985 5986端口 准备自签名证书 PS C:\Users\azureuser> $cert New-SelfSignedCertificate -DnsName &…...

编程新知 2026/2/4 16:43:10

第一篇：Liunx环境下搭建PaddlePaddle 3.0基础环境（Liunx Centos8.5安装Python3.10+pip3.10）

第一篇&#xff1a;Liunx环境下搭建PaddlePaddle 3.0基础环境&#xff08;Liunx Centos8.5安装Python3.10pip3.10&#xff09; 一&#xff1a;前言二&#xff1a;安装编译依赖二&#xff1a;安装Python3.10三&#xff1a;安装PIP3.10四&#xff1a;安装Paddlepaddle基础框架4.1…...

编程新知 2026/1/31 20:22:32