<!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. thinkphp事务不能回滚的问题（因为助手函数）

    thinkphp事务不能回滚的问题(因为助手函数) 一.总结 二.thinkphp 5 事务不能回滚 Db::startTrans(); try{ db('address')->where([' ...

  2. aspcms产品详情页调取相关产品

    产品详情页调用相关产品最常见的应用就是装饰公司网站,设计师页面要求调取设计师做过的案例.aspcms本身有这个功能,但不能完全符合要求,看代码 {aspcms:content sort={aspcms ...

  3. WM_CAP_DRIVER_CONNECT

    WM_CAP_DRIVER_CONNECT //ActiveX ---->OnCreate m_pit.Create(IDD_CAM_DIALOG,this);  CRect rc;  this ...

  4. 【JAVA编码专题】总结 分类： B1_JAVA 2015-02-11 15:11 290人阅读 评论(0) 收藏

    第一部分:编码基础 为什么需要编码:用计算机看得懂的语言(二进制数)表示各种各样的字符. 一.基本概念 ASCII.Unicode.big5.GBK等为字符集,它们只定义了这个字符集内有哪些字符,以及 ...

  5. heredoc（实现模板与代码的分离）

    heredoc(实现模板与代码的分离) 一.总结 heredoc实现模板与代码的分离,实现的是在后台编程语言中批量输出html代码,在这个批量输出的html代码中又可以嵌套编程语言变量.所以很方便. ...

  6. STL algorithm算法make_heap和sort_heap(32)

    make_heap原型: std::make_heap default (1) template <class RandomAccessIterator> void make_heap ( ...

  7. 手机浏览器 input 输入框 数字

    其实很简单了啦 type="tel"就行了呢 如果是type="number"其实不好用

  8. win7

    http://www.xitongiso.com/?pot http://www.potplayer.org/

  9. mac nginx php-fpm

    再一次被困在一个傻问题.由于我居然怀疑是不是mac本身就和centos的安装不一样.在一次次地排错后,最终发现.原来是我的nginx.conf的一行配置少写了一个字母.最后多亏用ls检查来定位到这个错 ...

  10. Android JNI编程（三）——C语言指针的初步认识、指针变量、互换两个数、函数返回多个值

    版权声明:本文出自阿钟的博客,转载请注明出处:http://blog.csdn.net/a_zhon/. 目录(?)[+] 一.什么是指针? 简单来说: 指针就是内存地址      内存地址就是指针. ...