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

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

倒计时和跳过广告

最近打开手机上的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;于是把代码完善了一下&…...

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

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

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

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

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

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

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, .…...

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

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

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

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

pdfjs在线预览组件的使用

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

python线程、协程

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

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

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

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

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

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

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

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

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

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…...

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

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

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

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

go语言的高级特性

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

华为VRP系统基本操作

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

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

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

外观模式简介

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

【kafka】Golang实现分布式Masscan任务调度系统

要求&#xff1a; 输出两个程序&#xff0c;一个命令行程序&#xff08;命令行参数用flag&#xff09;和一个服务端程序。 命令行程序支持通过命令行参数配置下发IP或IP段、端口、扫描带宽&#xff0c;然后将消息推送到kafka里面。 服务端程序&#xff1a; 从kafka消费者接收…...

Java如何权衡是使用无序的数组还是有序的数组

在 Java 中,选择有序数组还是无序数组取决于具体场景的性能需求与操作特点。以下是关键权衡因素及决策指南: ⚖️ 核心权衡维度 维度有序数组无序数组查询性能二分查找 O(log n) ✅线性扫描 O(n) ❌插入/删除需移位维护顺序 O(n) ❌直接操作尾部 O(1) ✅内存开销与无序数组相…...

Mybatis逆向工程,动态创建实体类、条件扩展类、Mapper接口、Mapper.xml映射文件

今天呢&#xff0c;博主的学习进度也是步入了Java Mybatis 框架&#xff0c;目前正在逐步杨帆旗航。 那么接下来就给大家出一期有关 Mybatis 逆向工程的教学&#xff0c;希望能对大家有所帮助&#xff0c;也特别欢迎大家指点不足之处&#xff0c;小生很乐意接受正确的建议&…...

QT: `long long` 类型转换为 `QString` 2025.6.5

在 Qt 中&#xff0c;将 long long 类型转换为 QString 可以通过以下两种常用方法实现&#xff1a; 方法 1&#xff1a;使用 QString::number() 直接调用 QString 的静态方法 number()&#xff0c;将数值转换为字符串&#xff1a; long long value 1234567890123456789LL; …...

视频行为标注工具BehaviLabel(源码+使用介绍+Windows.Exe版本)

前言&#xff1a; 最近在做行为检测相关的模型&#xff0c;用的是时空图卷积网络&#xff08;STGCN&#xff09;&#xff0c;但原有kinetic-400数据集数据质量较低&#xff0c;需要进行细粒度的标注&#xff0c;同时粗略搜了下已有开源工具基本都集中于图像分割这块&#xff0c…...

水泥厂自动化升级利器:Devicenet转Modbus rtu协议转换网关

在水泥厂的生产流程中&#xff0c;工业自动化网关起着至关重要的作用&#xff0c;尤其是JH-DVN-RTU疆鸿智能Devicenet转Modbus rtu协议转换网关&#xff0c;为水泥厂实现高效生产与精准控制提供了有力支持。 水泥厂设备众多&#xff0c;其中不少设备采用Devicenet协议。Devicen…...

es6+和css3新增的特性有哪些

一&#xff1a;ECMAScript 新特性&#xff08;ES6&#xff09; ES6 (2015) - 革命性更新 1&#xff0c;记住的方法&#xff0c;从一个方法里面用到了哪些技术 1&#xff0c;let /const块级作用域声明2&#xff0c;**默认参数**&#xff1a;函数参数可以设置默认值。3&#x…...

游戏开发中常见的战斗数值英文缩写对照表

游戏开发中常见的战斗数值英文缩写对照表 基础属性&#xff08;Basic Attributes&#xff09; 缩写英文全称中文释义常见使用场景HPHit Points / Health Points生命值角色生存状态MPMana Points / Magic Points魔法值技能释放资源SPStamina Points体力值动作消耗资源APAction…...

C++11 constexpr和字面类型:从入门到精通

文章目录 引言一、constexpr的基本概念与使用1.1 constexpr的定义与作用1.2 constexpr变量1.3 constexpr函数1.4 constexpr在类构造函数中的应用1.5 constexpr的优势 二、字面类型的基本概念与使用2.1 字面类型的定义与作用2.2 字面类型的应用场景2.2.1 常量定义2.2.2 模板参数…...

Docker环境下安装 Elasticsearch + IK 分词器 + Pinyin插件 + Kibana(适配7.10.1)

做RAG自己打算使用esmilvus自己开发一个&#xff0c;安装时好像网上没有比较新的安装方法&#xff0c;然后找了个旧的方法对应试试&#xff1a; &#x1f680; 本文将手把手教你在 Docker 环境中部署 Elasticsearch 7.10.1 IK分词器 拼音插件 Kibana&#xff0c;适配中文搜索…...