动态链接、鼠标击活链接

来源:网络收集 作者:佚名 阅读: 字体:[ ] [打印] [关闭]
自定义标签 wzsp 未创建

内容提要:尽管Dynamic HTML看似热闹,实际上,整个Web几乎依然是静态的。当然,一段时间以来,一些比较前卫的网点已经有了一些交互式的内容,但它们中的大部分还是在用插件或者是用针对不同版本的浏览器编写多个页面的方式实现 ……

dow.event.srcElement.tagName = = "A")。如果是,则该脚本程序将把特别的风格(在本例中是红颜色)用到链接上。类似地,在出现onmouseout事件时,rolloff函数将使该风格恢复为其缺省的颜色 (color="")。 

 

  这段脚本程序的最后两行是通知浏览器在onmouseover事件发生时执行rollon函数并在onmouseout事件发生时关闭鼠标击活链接(mouseover)功能。 

事半功倍 

  Internet Explorer 4.0允许你用DHTML来控制文档中的每一个对象,自然就可以实现除改变Anchor标记的颜色之外更多的功能。实际上,你可以将任何Cascading Style Sheets(CSS,是W3C的标准格式规范)中的元素应用到任何类型的对象或资源组件上。例如,除了使一个链接显示为红色之外,还可以给它加上或去掉下划线。 

  要去掉下划线,只需简单地将如下风格属性插入到该页面上的所有Anchor标记中即可: 

  style = "text-decoration: none" 

  这个语句将去掉链接的下划线,使它显示为正常或缺省状态。(在缺省情况下,Internet Explorer 4.0和Navigator 4.0将所有文本链接都加下划线,上述语句将逐个地改变这些链接的缺省状态。) 

  然后,在rollon函数下边加上如下语句: 

  window.event.srcElement.style. 

  textDecoration = "underline"; 

  现在,你所定义的鼠标击活链接(mouseover)事件的资源将变成红色并且有下划线风格。要注意在rolloff函数中加上如下语句可以再把下划线去掉: 

  window.event.srcElement.style. 

  textDecoration = "none"; 

  以上这些很快即可实现的修改功能显示了简单的DHTML脚本程序的威力,它无需装入任何图像,而是用一段高度灵活的可移植代码来产生引人注目的视觉效果,我可以说,你用它能访问任意文档,即使是在老版本的浏览器中也不会产生错误。想要获得此代码并自己加以掌握和应用的话,请访问我们的网点:www.windowspro.com。 

  ----------------- 

  Edward Grossman是www.windowspro.com网点的制作人,哲学博士,Web出现以前从事哲学领域的研究。他的E-mail:Edward_Grossman@zd.com 

  只需在文档的①head中加入约15行代码,就可以将任何Web网页上的②普通文本链接变成③交互式的鼠标击活链接(mouseover)。 

  ------------ 

  在你的网点上让DOM发挥作用 

  有了Dynamic HTML (DHTML),面向对象的程序设计已不再是只有编程专家才能作的事情,它正成为所有有经验的网页制作者也能涉足的领域。这在很大程度上要归功于Document Object Model,即DOM。这个W3C规范将文档中的每个成分都视为对象,不论它是一个、一种风格还是一个链接。脚本程序可以根据用户的输入、浏览器的类型或许多其他变量对这些对象进行修改,包括改变 的大小,改变风格,或者更新链接。 

  DOM可以打开整个文档,让Web制作者创建高度可定制的交互式页面,而不给用户造成大量下载的开销。这不仅可以实现低带宽的鼠标击活链接(mouseover),还可以实现可折叠的网页浏览菜单及可移动的页面组件(如图像、文本块等)。 

  关于DOM的更多信息,请访问网点:www.w3.org/domwww.microsoft.com/workshop/author/dhtml/和developer.netscape.com/docs/manuals/communicator/dynhtml/。 

  有关DHTML的应用实例,请访问:www.windowspro.comwww.projectcool.com(试试将Saturn到处拖动),并请浏览“View source”。 

  在IE 4.0中,可以用Dynamic HTML实现对几十种对象的操作。在网点www.microsoft.com上有详细内容的列表。 
 

 
上一页12
[标签: 动态链接、鼠标击活链接] [打印] [关闭]
站长评论(2) 查看所有评论
相关新闻

热门新闻

推荐新闻