使用Dreamweaver制作自动关闭的网页

在设计网页时，经常需要从主页面打开一个子窗口以便用户查看相关内容。通常情况下，一旦用户浏览完子窗口的内容，他们可能不会记得关闭这些窗口，从而导致大量浏览器窗口保持打开状态，消耗过多系统资源。因此，我们可以通过编程让子窗口在一定时间后自动关闭，这样既能提升用户体验，又能优化系统资源的使用。

以下是一个简单的实例，展示如何使用Dreamweaver实现这一功能。本示例创建了两个页面，如图1所示。其中，Index.html 是作为子窗口显示的页面，而 firstpage.html 包含了一个用于打开 Index.html 的链接。当用户点击这个链接时，会在一个新的子窗口中打开 Index.html。用户可以直接点击子窗口中的“关闭”链接来关闭窗口，或者无需任何操作，15秒后窗口会自动关闭。

图1 浏览器的弹出页面

下面详细介绍具体的操作步骤：

1. 首先，在本地站点中创建一个名为 Simple 的文件夹。

2. 在 Simple 文件夹内，创建两个新的HTML文件，分别命名为 Index.html 和 firstpage.html。

3. 双击 Index.html 文件，使用Dreamweaver打开并进入其设计视图。

4. 选择菜单栏中的 View > Head Content，以显示文档的头部区域。

5. 在文档头部部分，选择 Insert > Invisible Tags > Script，这将打开一个插入脚本对话框。在 Language 下拉菜单中选择 JavaScript，并在 Coctent 文本框中输入 setTimeout("self.close()", 15000)。这里的 15000 表示15秒（以毫秒为单位），可以根据实际需求调整此值。完成后单击 OK 按钮，完成脚本的插入。

图2 设置时间

6. 在文档窗口中添加文字“关闭”，并在属性面板的 Link 文本框中输入“###”，将其设置为一个空链接。

   

   卡拉OK视频制作

   卡拉OK视频制作，在几分钟内制作出你的卡拉OK视频

   178

   查看详情

7. 使用状态栏左端的快速标记编辑器，选中“关闭”链接，然后按下 Ctrl+T 组合键，进入快速标记编辑器的编辑模式。在 > 符号前添加 onclick="self.close()"。如图3所示，设置完成后单击 OK 按钮确认。

图3 设置时间

8. 保存 Index.html 文件并退出编辑环境。

9. 接下来开始设计 firstpage.html 页面。在本地站点的 Simple 文件夹中双击 firstpage.html，打开并进入其设计视图。

10. 在文档中输入“单击这里打开会自动关闭的子窗口”的文字，并在属性面板的 Link 文本框中输入“###”，将其设置为空链接。

11. 更便捷的方式是利用快速标记编辑器。首先将光标置于链接处，然后在状态栏左端的标识选择器上单击标识按钮，选中整个链接。接着按下 Ctrl+T 组合键，进入快速标记编辑器的编辑模式。在 > 符号前输入 onclick="window.open('index.html', null, 'width=200px, height=200px')"。如图4所示，设置完成后按回车键确认。

图4 设置单击链接时打开

12. 完成所有设置后，可以单击菜单栏中的 File > Save 保存工作。最后按下 F12 键，在浏览器中预览页面效果。

以上就是使用Dreamweaver制作自动关闭网页的具体步骤。如果遇到类似问题，只需按照上述指南操作即可解决问题。希望对有需要的用户有所帮助！

以上就是使用Dreamweaver制作自动关闭的网页的详细内容，更多请关注php中文网其它相关文章！