用JavaScript在主页上玩花样
#1 一、主页欢迎词或提示通知
当主页被下载显示时,在主页上浮现一个小小的提示窗口,显示你的欢迎词、主页更新信息、通知等等。
实现方法:
在〈head>与〈/head>之间插入代码:
〈script language=″JavaScript″〉
〈!--
window.open(″inform1.html″,″welcome″,″menubar=no,toolbar=no, location=no,directories=no,status=no,resizable=0,scrollbars=0,width=300,height=200″)
//-->
〈/script>
其中open()为window对象的方法,其格式为:
variable=open(url,name,[options])
options选项有:menubar菜单条,toolbar工具条,location地址栏,directories目录栏,status状态栏,resizable缩放性,scrollbars滚动条,其值为1/0或yes/no。width,height窗口的大小,值为像素。通过这些设定使窗口尽可能的小。
如果你的通知比较长,一个窗口容纳不下时,可以将内容分成几个部分,在inform1.html的〈head>与〈/head>中加入:〈meta http-equiv=Refresh content=″30″;url=″inform2.html″>,并在inform1.html中提示不要立刻关掉通知窗口,那么在30秒后会自动显示下一部分的内容。
#1 二、状态栏的链接说明
用〈a〉的属性“alt=说明”可以给链接标注说明,但这需要鼠标在链接上停留一会儿,而此时的状态栏只显示链接的url。用下列的方法可以实现在状态栏显示链接的提示或说明:
〈a href=url onMOuseOver=″window.status=′说明文字′;return true;″onMouseOut=″window.status=′′;″>
当鼠标移动到链接上时,状态栏出现链接提示。其中status为的一个window属性,用来指定浏览器状态栏出现的临时信息。
同时Window还有一个属性defaultStatus用来指定状态栏的缺省状态信息。一般用于首页作为欢迎提示。我们知道,主页封面的原理是先下载一页简单页,并指定在几秒后自动链接到主页。在这之间有一段时间状态栏显示“完成”,这就容易给性急的人一个错觉,以为你的主页就那么光秃秃一点儿。这时你可以在首页的代码中加入〈body onLoad=″window.defaultStatus=′您正在进入……的主页,请稍候′″>之类的提示语。
当然,你也可以让这种提示动起来,以便于显示较长的提示,在中间加入代码:
〈script language=″javascript″>
var timer1,iPosition=0;
function showsting()
{
sString =″大家好,欢迎光临本站访问!:-)您正在进入……的主页,载入中,请稍候″
var i,j,sMsg=sString;
j=(70/sMsg.length)+1;
for(i = 0;i < j;i++)
sMsg+=″″+sMsg;
window.status=sMsg.substring
(iPosition,iPosition+120);
if (iPosition++==sMsg.length)
iPosition=0;
timer1 = setTimeout(″banner()″,150);
}
showstring();
〈/script>
#1 三、活动图标
某些图像当鼠标移过时会变成一种模样,鼠标移开后复原,单击它时又变成另一种模样,很有趣。这种技术常用于制作活动图标。通常的实现方法比较复杂,这里介绍一种简单的实现方法:
〈a href=url target=″_blank″ onMouseOver=″document.images[1].src=″1.gif ″ onMouseOut= ″document.images[1].src=″2.gif″ onClick=″document.images[1].src=″3.gif″>〈img src=″1.gif″>〈/a>
注:其中图形数组元素images[1]的具体对象是指文档的第二个图形,而且1.gif,2.gif,3.gif的尺寸大小应该相同。
需要注意的是这种方法是直接改变图标的src来实现活动图标,在网络拥挤时可能会有一点延滞,因此图标的图像不宜过大,否则效果不好。
#1 四、送别词
给主页做一个送别词,能增加主页的人情味,提高访客的回头率。实现的方法是用事件处理器onUnLoad。虽然也可以像通知那样开一个小窗口,但是送别词应该简洁明了,否则会适得其反、令人生厌。这时可以调用Window的方法alert(),即显示一个提示信息框,如:
〈body onUnLoad=″alert(′nn来也匆匆nn去也匆匆nn一路好走!nYou are always welcome!′)″>
当然了,在显示欢迎或通知时也可以调用这种方法,只不过作用和效果就比用小窗口差一些了。
然而,这种以onLoad或onUnLoad触发的事件处理有一个副作用,就是每当页面刷新时都会触发事件,有时会令人生厌,因此采用时务必小心谨慎。