1.下载jQuery，并导入：https://blog.csdn.net/weixin_44718300/article/details/88746796

2.代码实现：

<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title></title>

		<script type="text/javascript" src="../js/jquery-3.3.1.js.css" ></script>

		<!--

			1. 导入JQ的文件

			2. 编写JQ的文档加载事件

			3.  启动定时器 setTimeout("",3000);

			4. 编写显示广告的函数

			5. 在显示广告里面再启动一个定时器

			6. 编写隐藏广告的函数

		-->

		<script>

			//显示广告

			function showAd(){

				$("#img1").slideDown(2000);

				setTimeout("hideAd()",3000);

			}

			//隐藏广告

			function hideAd(){

				$("#img1").slideUp(2000);

			}

		</script>

	</head>

	<body>

		<img src="../img/f001a62f-a49d-4a4d-b56f-2b6908a0002c_g.jpg" id="img1" width="100%" style="display:none"  />

	</body>

</html>

jQuery网页定时弹出广告的更多相关文章

  1. 使用jquery完成定时弹出广告图片

    <script src="../js/jquery-1.8.3.js"></script> <script type="text/javas ...

  2. jQuery学习(二)——使用JQ完成页面定时弹出广告

    1.JQuery效果 2.步骤分析: 第一步:引入jQuery相关的文件 第二步:书写页面加载函数 第三步:在页面加载函数中,获取显示广告图片的元素. 第四步:设置定时操作(显示广告图片的函数) 第五 ...

  3. 【JavaScript】案例三：使用JS完成页面定时弹出广告——事件(onload)

     事件(onload) *注意点: 变量加var局部变量,不加var全局变量 setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭. 返回值:返回 ...

  4. JS应用实例3：定时弹出广告

    在观看视频时候总会发现有广告弹出 这里就做一个类似这样的定时弹出广告的实例: 前面的JS代码和HTML写在同一个文件,实际开发中总是分开来写 用的时候引入即可 HTML代码: <!DOCTYPE ...

  5. 使用JS完成首页定时弹出广告图片

    一.需求分析 在首页中的顶部做一个定时弹出广告图片. 二.技术分析 隐藏图片: display: none        定时操作: setInterval(“显示图片的函数”, 3000); 三.代 ...

  6. JavaScript学习——使用JS完成页面定时弹出广告

    1.获取图片的位置(document.getElementById(“”))  隐藏图片:display:none 定时操作:setInterval(“显示图片的函数”,3000); 2.步骤分析 ( ...

  7. JS练习：定时弹出广告

    代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...

  8. JavaScripts广告轮播图以及定时弹出和定时隐藏广告

    轮播图: 函数绑定在body标签内 采用3张图,1.jpg   2.jpg  3.jpg  利用定时任务执行设置图片属性 src  利用for循环可以完成3秒一次 一替换. 定时弹出广告: 由于bod ...

  9. JS网页顶部弹出可关闭广告图层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

随机推荐

  1. 072、Java面向对象之定义构造方法

    01.代码如下: package TIANPAN; class Book { // 定义一个新的类 public Book() { // 构造方法 System.out.println("* ...

  2. 树莓派学习笔记——Restful服务 采用slim php apache

    0.前言     前些时间沉迷于Restful,采用PHP+Slim+MySQL实现了一些简单的API函数.但是这些工作都是在windows中实现(采用wamp server集成安装包),但是转到li ...

  3. PHP开发环境（Apache+mysql+PHPstorm+php）的搭建

    一.搭建思路 从浏览器到web服务器(Apache)到PHP环境到mysql数据库 二.环境搭建 1.浏览器(略) 2.Apache的安装与配置 1)官方下载地址:https://httpd.apac ...

  4. pta 拯救007(Floyd)

    7-9 拯救007(25 分) 在老电影“007之生死关头”(Live and Let Die)中有一个情节,007被毒贩抓到一个鳄鱼池中心的小岛上,他用了一种极为大胆的方法逃脱 —— 直接踩着池子里 ...

  5. vs2010编译C++ 状态标志

    // CTest.cpp : 定义控制台应用程序的入口点. // #include "stdafx.h" #include <iostream> #include &l ...

  6. 51nod 1441：士兵的数字游戏

    1441 士兵的数字游戏 题目来源: CodeForces 基准时间限制:4 秒 空间限制:131072 KB 分值: 40 难度:4级算法题  收藏  取消关注 两个士兵正在玩一个游戏,游戏开始的时 ...

  7. 浅谈Spring 5的响应式编程

    这篇使用Spring 5进行响应式编程的入门文章展示了你现在可以使用的一些新的non-blocking, asynchronous.感谢优锐课老师给予的指导! 近年来,由于响应式编程能够以声明性的方式 ...

  8. SpringBoot-拦截器配置

    SpringBoot-拦截器配置 SpringBoot-拦截器配置 在我们的SSM项目中,可以在web.xml中配置拦截器,但是在SpringBoot中只能使用java类来配置,配置方法如下. 创建拦 ...

  9. Easy Climb UVA - 12170 滚动dp +离散化+ 单调队列优化

    E.Easy Climb Somewhere in the neighborhood we have a very nice mountain that gives a splendid view o ...

  10. LeetCode实战练习题目 - Array

    实战练习题目 - Array 盛最多水的容器 class Solution { public: int maxArea(vector<int>& height) { int res ...