<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<style type="text/css">

div{

	width: 300px;

	height: 300px;

	border:1px red solid;

	position: fixed;/*相对于浏览器窗体进行定位*/

	right: 5px;

}

img{

float:left;

width:180px;

height:180px;

}

</style>

<script type="text/javascript">

/*两个定时器函数的差别：

 * setTimeout(表达式,时间间隔)：经过一次时间间隔运行一次表达式----仅仅运行一次

 setInterval(表达式。时间间隔)：每经过一次时间间隔运行一次表达式----运行无限次

 setTimeout能够通过回调函数本身就ok了,在以下的代码中有所体现哦

 */

window.onload=function(){

	init();

}

//设置div的bottom的值。是指div的底部距离它的最临近的父元素之间的距离

	var bottomPosition=-550;

	function init(){

		//由于整个文档中有仅仅有一个div，全部通过这样的方式获取了存储图片的div了

		var divNode = document.getElementsByTagName("div")[0];

		//设置了bottom属性。使得開始载入的时候这个div是看不到的

		divNode.style.bottom=bottomPosition+"px";

		bottomPosition+=1;//没启动这个函数位置就会向上移动一个像素。

		if(bottomPosition<50){

			//间隔10毫秒启动这个函数

			setTimeout(init,10);

		}

	}

	//加入一个关闭button

	function closeAdv(){

		var divNode = document.getElementsByTagName("div")[0];

		divNode.style.display="none";

	}

</script>

</head>

<body>

	<div>

	<input onclick="closeAdv();"/>

	<img src="3.jpg">胡哥是个传说胡哥是个传说胡哥是个传说胡哥是个传说

	胡哥是个传说	胡哥是个传说，胡哥是个传说，胡哥是个传说

	胡哥是个传说	胡哥是个传说。胡哥是个传说，胡哥是个传说

	胡哥是个传说胡哥是个传说

	胡哥是个传说	胡哥是个传说，胡哥是个传说。胡哥是个传说

	</div>

</body>

</html>

注意：那里3.jpg该位置需要给她一个图片。

版权声明：本文博主原创文章，博客，未经同意不得转载。

JavaScript动态广告弹出框的更多相关文章

  1. JavaScript三种弹出框（alert，confirm和prompt）用法举例

    http://blog.csdn.net/lucky51222/article/details/45604681 我们在做网页交互的时候往往需要用户在操作之前弹出一个提示消息框来让用户做一些点击才能继 ...

  2. bootstrap-js(六)弹出框

    实例 为任意元素添加一小块浮层,用于存放非主要信息. 弹出框的标题和内容的长度都是零的话将永远不会被显示出来. 初始化 由于性能的原因,工具提示和弹出框的 data 编程接口(data api)是必须 ...

  3. Bootstrap-Plugin：弹出框（Popover）插件

    ylbtech-Bootstrap-Plugin:弹出框(Popover)插件 1.返回顶部 1. Bootstrap 弹出框(Popover)插件 弹出框(Popover)与工具提示(Tooltip ...

  4. js简单显示和隐藏div，触发超链接，动态更改button值，setInterval（）简单使用，jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  5. JavaScript插件——弹出框

    (JavaScript插件——弹出框) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.htm ...

  6. easyui tree datagrid动态添加表头和表格数据，动态弹出框，修改和删除按钮

    1.要有获取表头的URL和表格的URL 背景:点击树的一个节点,就加载一个表格,这个表格是动态的,表头和表格数据都是动态的 解决方案:需要两个URL,一个是获取表头的URL,一个是获取表格数据的URL ...

  7. JavaScript 实现简单的 弹出框关闭框

    JavaScript 实现简单的 弹出框关闭框 知识点: 1.javaScript 添加HTML标签 2.javaScript 添加HTML标签属性 3.javaScript 追加元素 代码献上: & ...

  8. 四种常见的提示弹出框（success，warning，error，loading）原生JavaScript和jQuery分别实现

    原文:四种常见的提示弹出框(success,warning,error,loading)原生JavaScript和jQuery分别实现 虽然说现在官方的自带插件已经有很多了,但是有时候往往不能满足我们 ...

  9. 练习：javascript弹出框及地址选择功能,可拖拽

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. EularProject 41：最长的n位Pandigital素数问题

    Pandigital prime Problem 41 We shall say that an n-digit number is pandigital if it makes use of all ...

  2. CNTK 搞深度学习-1

    CNTK 搞深度学习 Computational Network Toolkit (CNTK) 是微软出品的开源深度学习工具包.本文介绍CNTK的基本内容,如何写CNTK的网络定义语言,以及跑通一个简 ...

  3. Asp.NETCore让FromServices回来

    起因 这两天,我忽然有点怀念 Asp.NET MVC 5 之前的时代,原因是我看到项目里面有这么一段代码(其实不止一段,几乎每个 Controller 都是) [Route("home&qu ...

  4. 转 OC温故:类的三大特性(封装，继承，多态)

    原文标题:OC学习篇之---类的三大特性(封装,继承,多态) 我们都知道,面向对象程序设计中的类有三大特性:继承,封装,多态,这个也是介绍类的时候,必须提到的话题,那么今天就来看一下OC中类的三大特性 ...

  5. [RxJS] Stopping a shared observable execution

    ConnectableObservable has the connect() method to conveniently dictate the start of the shared execu ...

  6. struts2漏洞原理及解决的方法

    1.原理 Struts2的核心是使用的webwork框架,处理 action时通过调用底层的getter/setter方法来处理http的參数,它将每一个http參数声明为一个ONGL(这里是ONGL ...

  7. 算法 Tricks（六）— if 条件分支的简化

    考虑下面的三分支的定义式: f=⎧⎩⎨⎪⎪a,b,a+b,x>yx<yx=y int f = 0; if (x >= y) f += a; if (x <= y) f += b ...

  8. lv resize

    # lvreduce -L -400G /dev/vg_atalinux001/lv_home # resize2fs   /dev/vg_atalinux001/lv_home resize2fs ...

  9. 【31.72%】【codeforces 604B】More Cowbell

    time limit per test2 seconds memory limit per test256 megabytes inputstandard input outputstandard o ...

  10. Mariadb配置文件优化参数（仅供参考）

    [client]#password= your_passwordport= 3306         socket= /tmp/mysql.sock!includedir /opt/local/mys ...