您的位置:首页 > Web前端 > JavaScript

JavaScript特效实例001-打开新窗口显示广告信息

2015-05-05 20:33 441 查看

实例001 打开新窗口显示广告信息

实例说明

本实例要在窗口每次被加载的时候弹出一个广告对话框。

技术要点

本实例主要应用JavaScript的window对象。

window对象的常用方法

方法说明
alert()弹出一个警告对话框
confirm()在确认对话框中显示指定的字符串
prompt()弹出一个提示对话框
close()关闭被引用的窗口
focus()将被引用的窗口放在所有打开窗口的前面
open()打开新浏览器窗口并且显示由URL或名字引用的文档,并设置创建窗口的属性
resizeTo(x,y)设置窗口的大小
resizeBy(offsetx,offsety)按照指定的位移量设置窗口的大小
应用JavaScript的open()方法可以打开浏览器窗口.
使用window对象打开窗口的语法格式如下。
WindowVar = window.open(url,windowname,location);
参数说明如下:
1.WindowVar:当前打开窗口的句柄。
2.url:目标窗口的URL。
3.windowname:window:对象的名称。
4.location:对窗口属性进行设置。

对窗口属性进行设置的可选参数

属性说明
width窗口的宽度
height窗口的高度
scrollbars是否显示滚动条
resizable设定窗口大小是否固定
toolbar浏览器工具条,包括后退及前进按钮等
menubar菜单条,一般包括有文件,编辑及其他一些条目
location定位区,也叫地址栏,是可以输入URL的浏览器文本区
direction更新信息按钮

实现过程

(1)首先创建用于弹出广告信息的页面,在该页面中添加所要宣传的广告信息。
new.html
<html>
<head>
<title>打开新窗口显示广告信息</title>
<style type="text/css">
body{
background-image:url(new.jpg);
background-repeat:no-repeat;
}
</style>
</head>
<body></body>
</html>
(2)在index.html页面写上JS代码实现功能

index.html
<html>
<head>
<meta charset="utf-8" />
<script type="text/jscript" language="javascript">
window.open("new.html","new","height=280,width=800,top=10,left=20,resizable=no, location=no",false);
</script>
<style type="text/css">
p{
font-size:24px;
color:#F00;
}
</style>
</head>
<body>
<p>网站首页</p>
</body>
</html>
注:style标签的内容为css的知识,我们关注的是script标签内的内容。
这样我们的这个实例就做好了。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: