使用DW设计一个限时手动关闭的网页
在设计页面时javascript关闭页面,通常会从页面中打开子窗口供查看者查看。 通常,一旦浏览者看过这些子窗口中的内容,浏览者就不再需要这些内容,并且常常忘记关闭那些小窗口,从而打开许多浏览器窗口,消耗大量资源。 因此,我们可以将子窗口设计为在一段时间后手动关闭。
本例中制作了两个页面,如图1所示,Index.html是子窗口中显示的页面,名为firstpage.html的页面包含在子窗口中打开Index.html的链接。 单击链接时,index.html 将在子窗口中打开。 您可以直接点击子窗口中的“关闭”链接来关闭子窗口,也可以忽略它。 15秒后,子窗口也将手动关闭。
具体操作如下:
1、在本地站点生成Smlple文件夹。
2. 在Smlple文件夹中,生成一个名为Index.html的文件和一个名为firstpage.html的文件。
3. 双击Index.html 打开文档并进入文档的设计视图窗口。
4、点击菜单View/HeadContent,显示文档的大脑区域。
5. 单击“设计视图”窗口中的文档后竖框。 选择菜单“插入/InvisibleTags/脚本”以打开“InsetScript”对话框。 如图2所示,在Language下拉列表框中选择JavaScript选项,并在Coctento文本框中输入“setTimeout("self.close()", 15000)”。 单击“确定”按钮,完成插入文档内部 15 秒后手动关闭子窗口的脚本。 代码中15000表示15000微秒,也就是15秒,你也可以根据自己的需要改成自己需要的微秒数。
6、在文档窗口中输入“关闭”一词,在属性面板的链接文本框中输入“###”javascript关闭页面,并设置为空链接。
7. 在状态栏顶部的快速标签编辑器中,单击“标签”按钮。 选择“关闭”链接,然后按Ctrl+T组合键打开快速标签编辑器并进入快速标签编辑器的编辑标签模式。 然后在“>”之前输入“onclick=”selfclose()””。 如图3所示,设置完成后,单击“确定”按钮确认操作。 这样,Index.html作为子窗口打开后,点击链接就可以立即关闭子窗口。
8. 保存Index.html 文件并退出index.html 的Dremweaver 窗口。
9. 现在开始设计 fristpage.html 页面。 在本地站点的 Smlple 文件夹中,双击 fristpage.html 打开文档并进入文档的“设计视图”窗口。
10. 在文档中键入“单击此处打开将手动关闭的子窗口”。 然后在属性面板的链接文本框中输入“###”,将其设置为空链接。
11. 您可以通过将 OpenBrowserWindow 行为应用于链接来设置单击链接时打开的 Index.html 窗口,但更方便的方法是使用快速标签编辑器。 方法是先将插入点放置在链接中,然后单击状态栏顶部标签选择器上的标签按钮来选择整个链接。 然后按Ctrl+T组合键打开快速标签编辑器,并进入快速标签编辑器的编辑标签模式。 然后在“>”之前输入“onclick=”window.open(index.html,null,width=200px,height=200px)””。 设置完成后,按Enter键确认操作。
12、以上操作完成本例的设置。 您可以单击菜单并使用文件/保存来保存您的工作。然后按F12键在浏览器中预览页面的效果
发表评论