使用jquery完成定时弹出广告图片
<script src="../js/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
//1.书写显示广告的定时操作
time=setInterval("showAdd()",3000);
});
//2.书写显示广告图片的函数
function showAdd(){
//3.获取广告图片,并让其显示
// $("#img2").show(1000); //普通弹出
// $("#img2").slideDown(5000);//向下滑动
$("#img2").fadeIn(5000);
//4.清楚显示图片的定时操作
clearInterval(time);
//5.设置隐藏图片的定时操作
time=setInterval("hiddenAd()",3000);
}
function hiddenAd(){
//6.获取广告图片,并让其隐藏
// $("#img2").hide(); //普通隐藏
// $("#img2").slideUp(5000);//向上慢慢隐藏
$("#img2").fadeOut(5000);
//7.清楚隐藏图片的定时操作
clearInterval(time);
}
</script>
<!--定时弹出广告图片位置-->
<img src="../img/f001a62f-a49d-4a4d-b56f-2b6908a0002c_g.jpg" width="100%"
style="display:none" id="img2"/>
使用jquery完成定时弹出广告图片的更多相关文章
- 使用JS完成首页定时弹出广告图片
一.需求分析 在首页中的顶部做一个定时弹出广告图片. 二.技术分析 隐藏图片: display: none 定时操作: setInterval(“显示图片的函数”, 3000); 三.代 ...
- jQuery网页定时弹出广告
1.下载jQuery,并导入:https://blog.csdn.net/weixin_44718300/article/details/88746796 2.代码实现: <!DOCTYPE h ...
- jQuery学习(二)——使用JQ完成页面定时弹出广告
1.JQuery效果 2.步骤分析: 第一步:引入jQuery相关的文件 第二步:书写页面加载函数 第三步:在页面加载函数中,获取显示广告图片的元素. 第四步:设置定时操作(显示广告图片的函数) 第五 ...
- JavaScript学习——使用JS完成页面定时弹出广告
1.获取图片的位置(document.getElementById(“”)) 隐藏图片:display:none 定时操作:setInterval(“显示图片的函数”,3000); 2.步骤分析 ( ...
- 【JavaScript】案例三:使用JS完成页面定时弹出广告——事件(onload)
事件(onload) *注意点: 变量加var局部变量,不加var全局变量 setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭. 返回值:返回 ...
- JS应用实例3:定时弹出广告
在观看视频时候总会发现有广告弹出 这里就做一个类似这样的定时弹出广告的实例: 前面的JS代码和HTML写在同一个文件,实际开发中总是分开来写 用的时候引入即可 HTML代码: <!DOCTYPE ...
- 基于jQuery向下弹出遮罩图片相册
今天给大家分享一款基于jQuery向下弹出遮罩图片相册.单击相册图片时,一个遮罩层从上到下动画出现.然后弹出显示图片.这款插件适用浏览器:IE8.360.FireFox.Chrome.Safari.O ...
- JS练习:定时弹出广告
代码: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title ...
- JavaScripts广告轮播图以及定时弹出和定时隐藏广告
轮播图: 函数绑定在body标签内 采用3张图,1.jpg 2.jpg 3.jpg 利用定时任务执行设置图片属性 src 利用for循环可以完成3秒一次 一替换. 定时弹出广告: 由于bod ...
随机推荐
- 43.VUE学习之--组件之使用.sync修饰符与computed计算属性超简单的实现美团购物车原理
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- oracle for update和for update nowait 的区别
原文地址:http://www.cnblogs.com/quanweiru/archive/2012/11/09/2762223.html 1.for update 和 for update nowa ...
- [洛谷P1168]中位数(Splay)/(主席树)
Description 给出一个长度为N的非负整数序列A[i],对于所有1 ≤ k ≤ (N + 1) / 2,输出A[1], A[2], -, A[2k - 1]的中位数.即前1,3,5,--个数的 ...
- Leetcode 96. 不同的二叉搜索树
题目链接 https://leetcode.com/problems/unique-binary-search-trees/description/ 题目描述 给定一个整数 n,求以 1 ... n ...
- 决策树python实现小样例
我们经常使用决策树处理分类问题,近年来的调查表明决策树也是经常使用的数据挖掘算法K-NN可以完成多分类任务,但是它最大的缺点是无法给出数据的内在含义,决策树的主要优势在于数据形式非常容易理解决策树的优 ...
- WWDC2014:留给微软的时间不多了!
业界定律:第一和第二吵架,最受伤的总是第三名.苹果的wwdc和谷歌io大会的在6月相继召开,结果必然会有一番对比互讽.作为一个曾经的c#程序员,看着在角落里不断划圈圈的微软,心里总是不禁想起那句话:留 ...
- leetcode 【 Remove Duplicates from Sorted Array 】python 实现
题目: Given a sorted array, remove the duplicates in place such that each element appear only once and ...
- linux环境搭建系列之svn安装
前提: linux centOS 64位操作系统 1.root账号 2.#yum install -y subversion 出现如下报错: 尝试Telnet https://www.baidu.co ...
- Leetcode 552.学生出勤记录II
学生出勤记录II 给定一个正整数 n,返回长度为 n 的所有可被视为可奖励的出勤记录的数量. 答案可能非常大,你只需返回结果mod 109 + 7的值. 学生出勤记录是只包含以下三个字符的字符串: ' ...
- 纸上得来终觉浅,绝知此事要躬行——Spring boot任务调度
前言:之前今日开讲项目的时候,用到了Quartz进行任务调度.后来做一个电商项目的时候,还用到了Quartz任务调度. 觉得挺简单的,a peace of cake. 忽略了总结,当时闭着眼睛都能捉 ...