JavaScript窗口功能指南之定制新窗口

window.open()方法的基本语法结构是:  

  window.open(sURL, sName);

  然而,你可以通过使用2个附加的参数定制新窗口:

  window.open(sURL, sName[, sFeatures][, bReplace]);

  通过省略这些参数,你可以使用默认特征。让我们先看看bReplace参数,它仅仅被Internet Explorer:4和以后版本所支持。只有当第2个参数命名一个已经存在的窗口时,这个参数才有用。它是一个Boolean型数值,如果为true,就表示第一个参数指定的URL替换当前窗口浏览位置在历史中保存的地址,如果为false,就表示在窗口的浏览历史记录中创建一个新项目(这是默认情况)。由于这个参数只被微软的浏览器所支持,所以显得不很有用。下面让我们看看广为人知的JavaScript窗口设置性质。

  open()方法的第3个参数是一个字符串,包含一个以逗号分隔的选项列表(不要包含任何空格)。在驶入可用功能的海洋前,先让我们看看它们的含义所在。这里有一个例子:

  win = window.open("http://www.docjs.com/", "docjs", "location=1,menubar=1,resizable=1");

  这个语句打开一个可变尺寸的窗口,它带有一个地址栏和一个菜单条,而其他的特征都被关闭。比如,没有指定status特征,新窗口就没有了状态栏。注意,还有几个其他的方法来定义窗口特征。下面是几个和前面语句功能等价的命令:

  win = window.open("http://www.docjs.com/", "docjs", "location,menubar,resizable");

  win = window.open("http://www.docjs.com/", "docjs", "location=yes,menubar=yes,resizable=yes");

  win = window.open("http://www.docjs.com/", "docjs", "location,menubar=1,resizable=yes");

  许多特征可以是yes,或者是no。对于这些特征,你也可以使用1代替yes,0代替no。如果你想激活一个特征,同样可以简单地在sFeatures字符串中列出特征的名字。如果没有列出,就表示屏蔽该功能(titlebar和hotkeys除外)。sFeatures参数是一个以逗号分隔的功能列表,其中不应该包含任何空格或者空白字符。列表中的每一个元素应该包含下面的格式:

  feature[=value]

  分配sFeatures参数一个空字符串与全部省略这个参数之间有一个很大的区别。如果调用open()没有任何参数,那么所有的特征都被设置为默认值。换言之,浏览器将创建一个窗口,它有默认得宽度和高度、标准的菜单、工具栏,以及其他浏览器具备的特征。如果你使用空字符串做为需要功能的列表,浏览器将打开一个窗口,它的所有特征都是被屏蔽的(titlebar和hotkeys除外)。

  window.open()方法的第2个参数sName指定了窗口的名字。如果是一个已经存在窗口的名字,浏览器就在那个窗口中装载指定的URL(sURL)。所以,如果sName指定了存在的窗口,浏览器就将忽视定义的特征列表。

  不是所有的窗口特征都能被所有的浏览器所支持。如果浏览器不能识别指定的特征,它就简单地忽视掉。下面来看看JavaScript中各种窗口特征的定义:

alwaysLoweredinnerWidthscreenY
alwaysRaisedleftscrollbars
channelmodelocationstatus
dependentmenubartitlebar
directoriesouterWidthtoolbar
fullscreenouterHeighttop
heightmenubarwidth
hotkeysresizablez-lock
innerHeightscreenX 

alwaysLowered
  Internet Explorer:不支持

  Navigator:版本 4+

  指定窗口总是保留在堆栈的最下面。换言之,不管新窗口是否激活,总是其他窗口下。

  window.open("alwayslowered.html", "_blank", "alwaysLowered");

alwaysRaised
  Internet Explorer:不支持

  Navigator:版本 4+

  指定窗口总是保留在堆栈的最上面。换言之,不管新窗口是否激活,总是其他窗口上。

  window.open("alwaysraised.html", "_blank", "alwaysRaised");

channelmode
  Internet Explorer:版本 4+

  Navigator:不支持

  指定是否按照剧场模式显示窗口,以及是否显示频道区。

  window.open("channelmode.html", "_blank", "channelmode");

dependent
  Internet Explorer:不支持

  Navigator:版本 4+

  定义是否窗口成为当前打开窗口的依赖子窗口。依赖窗口就是当它的父窗口关闭时,它也随即关闭。在windows平台上,一个依赖窗口不会在任务栏上显示。

  window.open("dependent.html", "_blank", "dependent");

directories
  Internet Explorer:所有版本

  Navigator:所有版本

  指定是否显示目录按钮(比如众所周知的"What's Cool" and "What's New" 按钮)。Internet Explorer将这些目录按钮引用为链接工具栏,Navigator(版本4和以上)称之为个人工具栏。

  window.open("directories.html", "_blank", "directories");

fullscreen
  Internet Explorer:版本 4+

  Navigator:不支持

  定义是否按照全屏方式打开浏览器。请小心使用全屏模式,因为在这种模式下,浏览器的标题栏和菜单都被隐藏,所有你应该提供一个按钮或者其他可视的线索来帮助用户关闭这个窗口。当然,使用热键ALT+F4也能关闭窗口。

  window.open("fullscreen.html", "_blank", "fullscreen");

height
  Internet Explorer:所有版本

  Navigator:所有版本

  以象素pixel为单位定义窗口文档显示区域的高度,最小数值是100。如果仅仅定义高度,Internet Explorer使用给定的高度和默认的宽度。对于Navigator,如果不同时指定width或者innerWidth,那么就将忽略这个属性。

  window.open("height.html", "_blank", "height=200,width=300");

hotkeys
  Internet Explorer:不支持

  Navigator:版本 4+

  如果没有定义(或者为0),那么就屏蔽了没有菜单条的新窗口的大部分热键。但是安全以及退出热键仍然保留。

  window.open("hotkeys.html", "_blank", "hotkeys=0,menubar=0");

innerHeight
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素pixel为单位定义窗口文档显示区域的高度,最小数值是100。在Navigator版本4中,这个特征替换height,为得是保持向后兼容。对于Navigator,如果不同时指定width或者innerWidth,那么就将忽略这个属性。

  window.open("innerheight.html", "_blank", "innerHeight=200,innerWidth=300");

innerWidth
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素pixel为单位定义窗口文档显示区域的宽度,最小数值是100。在Navigator版本4中,这个特征替换width,为得是保持向后兼容。对于Navigator,如果不同时指定height或者innerHeight,那么就将忽略这个属性。

  window.open("innerwidth.html", "_blank", "innerHeight=200,innerWidth=300");

left
  Internet Explorer:版本 4+

  Navigator:不支持

  以象素为单位定义窗口的X左标。

  window.open("left.html", "_blank", "left=20");

location
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否显示浏览器中供地址URL输入的文本域。

  window.open("location.html", "_blank", "location");

menubar
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否显示菜单条(菜单条位于窗口顶部,包括“文件”和“编辑”等)。

  window.open("menubar.html", "_blank", "menubar");

outerHeight
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素为单位定义窗口(它的外部边界)的总高度,最小数值比100多一些,因为窗口内容区域的高度必须至少是100。如果没有同时定义outerWidth,Navigator将忽视这个特征。

  window.open("outerheight.html", "_blank", "outerHeight=200,outerWidth=300");

outerWidth
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素为单位定义窗口(它的外部边界)的总宽度,最小数值比100多一些,因为窗口内容区域的宽度必须至少是100。如果没有同时定义outerHeight,Navigator将忽视这个特征。

  window.open("outerwidth.html", "_blank", "outerHeight=200,outerWidth=300");

resizable
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否窗口可以通过它的边界进行大小缩放控制。依赖于平台不同,用户也许还有其他改变窗口大小的方法。

  window.open("resizable.html", "_blank", "resizable");

screenX
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素为单位定义窗口的X坐标。

  window.open("screenx.html", "_blank", "screenX=20");

screenY
  Internet Explorer:不支持

  Navigator:版本 4+

  以象素为单位定义窗口的Y坐标。

  window.open("screeny.html", "_blank", "screenY=20");

scrollbars
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否激活水平和垂直滚动条。

  window.open("scrollbars.html", "_blank", "scrollbars");

status
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否在窗口的下部添加状态栏。

  window.open("status.html", "_blank", "status");

titlebar
  Internet Explorer:Version 5+

  Navigator:版本 4+

  定义是否显示窗口的标题栏。在Internet Explorer中,除非调用者是一个HTML应用程序或者一个可信任的对话框,那么这个特征是被屏蔽的。

  window.open("titlebar.html", "_blank", "titlebar=0");

toolbar
  Internet Explorer:所有版本

  Navigator:所有版本

  定义是否显示浏览器的工具栏(位于窗口的上部,包括“后退”和“向前”)。

  window.open("toolbar.html", "_blank", "toolbar");

top
  Internet Explorer:版本 4+

  Navigator:不支持

  以象素为单位定义窗口的纵坐标。

  window.open("top.html", "_blank", "top=20");

width
  Internet Explorer:所有版本

  Navigator:所有版本

  以象素pixel为单位定义窗口文档显示区域的宽度,最小数值是100。如果仅仅定义宽度,Internet Explorer使用给定的宽度和默认的高度。对于Navigator,如果不同时指定height或者innerHeight,那么就将忽略这个属性。

  window.open("width.html", "_blank", "height=200,width=300");

z-lock
  Internet Explorer:不支持

  Navigator:版本 4+

  定义窗口激活时不在堆栈中浮起,就是说,新窗口当被激活时并不能位于其他窗口之上。

  window.open("zlock.html", "_blank", "z-lock");
 
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以使用OpenLayers来制作专题地图。OpenLayers是一个开源的JavaScript库,它提供了一套丰富的地图功能和交互性工具,可以帮助你在网页上创建交互式地图应用。 下面是一个简单的步骤指南,帮助你开始使用OpenLayers制作专题地图: 1. 引入OpenLayers库:在你的网页中引入OpenLayers库的JavaScript文件。你可以从OpenLayers官方网站上下载最版本的库文件,并将其添加到你的项目中。 2. 创建地图容器:在HTML页面中创建一个div元素,作为地图的容器。给这个div元素设置一个唯一的id,以便后续使用。 3. 初始化地图:使用JavaScript代码,在页面加载时初始化地图对象。通过指定地图容器的id,以及设置一些基本属性,如初始中心点、缩放级别和地图类型,来创建一个地图实例。 4. 添加图层:使用OpenLayers提供的不同类型的图层,如矢量图层、栅格图层或瓦片图层,将地理数据添加到地图上。你可以从不同的数据源加载地理数据,如GeoJSON文件、WMS服务或XYZ瓦片。 5. 样式化和交互性:使用OpenLayers提供的样式化和交互性工具,为地图上的要素添加样式、标签或弹出窗口。你可以通过自定义样式来突出显示特定的地理特征,并添加交互性工具,如缩放、平移或绘制。 6. 添加控件:OpenLayers提供了许多控件,如缩放控件、鼠标位置控件或图层切换控件。你可以根据需要添加这些控件,以增强用户体验和地图功能。 通过以上步骤,你可以使用OpenLayers制作专题地图,并根据你的需求进行定制。记得查阅OpenLayers的官方文档和示例代码,以获取更多详细信息和帮助。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值