JavaScript为你的网页添油加醋
--------------------------------------------------------------------------------
http://www.sina.com.cn 2001/06/19 16:29 赛迪网 牛云飞
制作弹出式窗口
有许多网页在打开的时候，会弹出一个较小的窗口，显示广告或一些最新信息。这种弹出式窗口制作很简单，只要在网页代码的〈body〉标签后面插入类似代码即可：
〈script language=″javascript″〉
window.open(′url′,′窗口名′,′属性列表′);
〈/script〉
其中“url”是在窗口中显示的html文档的地址；“窗口名”可任意起一个，但不要用中文；“属性列表”是一个用逗号分开的各个属性值的字符串，它确定了弹出窗口的外观与状态。常用属性有：
toolbar（是否显示工具栏
）、location（是否显示地址栏）、directories（是否显示常用链接）、status（是否显示状态栏）、menubar（是否显示选单条）、scrollbars（是否使用滚动条）、resizable（是否可改变大小），这些属性值等于1时表示是，等于0或不将此属性加入列表时表示否。此外，还有width（窗口宽）、height（窗口高）、top（与屏幕上边的距离）、left（与屏幕左边的距离）等属性用于对弹出窗口大小和位置的控制。
例子：要制作一个只有地址栏、无滚动条、可改变大小、高100像素、宽300像素、初始位置为距屏幕上边与左边都为100像素的弹出窗口，并在其中显示当前目录下hello.htm的内容，则要将上面的代码中间的一段改为：“window.open(′hello.htm′,′window1′,′location=1,scrollbars=0,resizable=1,height=100,width=300,top=100,left=100′);”。
制作“关闭窗口”、“前进”、“后退”链接
“关闭窗口”、“前进”、“后退”这些浏览器本身具备的功能，也可通过页面中的超级链接来实现。
在frontpage中，选择要链接的文字或图像，按ctrl－k 打开“create hyperlink（创建超级链接）”对话框，在“url”中输入“javascript:window.close()”可制作关闭当前浏览器窗口链接；输入“javascript:history.forward()”可制作“前进”链接，功能相当于浏览器上的“前进”按钮；输入“javascript:history.back()”可制作“后退”链接，功能相当于浏览器上的“后退”按钮。这些链接对于没有选单、没有按钮的弹出式窗口会非常有用。
制作具有链接功能的下拉式选单
在frontpage 中，使用“insert（插入）”〉“form field（表单域）”〉“drop－down menu（下拉选单）”命令插入一个下拉选单。右键单击它，在快捷选单中选“form field properties（表单域属性）”，在打开的对话框中按“add...（添加...）”按钮打开“add choice（添加选项）”对话框，在“choice（选项）”中输入要在下拉选单中显示的文本描述，点击“指定值”前的复选框使该项有效，在它下边的文本框中输入相应的完整url地址，然后确定。继续添加其它选单选项，完成后确定。
在表单中任意位置击右键，在快捷选单中选“form properties（表单属性）”，在弹出的对话框中选择“send to other（发送到其它）”。
点击frontpage 界面左下角的“html”标签进入源代码状态，寻找刚才制作的下拉式选择框所对应的代码，在〈select〉标签中加入这样一段代码：onchange=″location.href=this.options[this.selectedindex].value″。
用frontpage可视化编辑样式表
你一定见过许多主页上有这样的链接，它并不像普通链接总是带下划线，当鼠标指上去时，链接文字就会变色并出现下划线，这都是样式表的功劳！
用frontpage打开要编辑的html文件，使用选单命令“format(格式)”〉“stylesheet...(样式...)”打开“format stylesheet(样式格式)”对话框，这里显示了当前文件内联样式表的内容，你可以在〈!－－...－－〉 之间添加或修改样式表语句。如果要添加新的样式语句，首先要输入标签(如：a:link、a:hover、a:active、a:visited 它们分别表示：正常情况下未访问过的、鼠标接近时、鼠标点击时、访问过的链接的样式)。然后，把光标停在这个标签末尾，点击对话框左下角的“style...(样式...)”按钮，进入“style(样式)”对话框，在这里你可以跟据需要设置多种样式属性。如果要更改某个标签的样式，只要光标停在相应标签后面的一对大括号中代码的任意位置，然后按“style...(样式...)”按钮进行修改即可。
|
