Đang chuẩn bị liên kết để tải về tài liệu:
DHTML Utopia Modern Web Design Using JavaScript & DOM- P8

DHTML Utopia Modern Web Design Using JavaScript & DOM- P8:In a single decade, the Web has evolved from a simple method of delivering technical documents to an essential part of daily life, making and breaking relationships and fortunes along the way. “Looking something up on the Internet,” by which is almost always meant the Web, is now within reach of almost anyone living in a first-world country, and the idea of conducting conversations and business (and probably orchestras) in your Web browser is no longer foreign, but part of life | Chapter 5 Animation Here s the style sheet File risingTooltips.css ul div extra display block background-color blue position absolute top 30px left 0 width 100 height 2em padding 0 margin 0 z-index 20 div extra z-index 10 li display inline font-weight bold padding 0 margin 0 li a color white background-color blue span position absolute top 0 background yellow border 1px solid blue border-width 1px 1px 0 1px display none Finally here s the script File risingTooltips.js var rH addEvent function elm evType fn useCapture addEvent cross-browser event handling for IE5 NS6 Mozilla 120 Licensed to siowchen@darke.biz Full Rising Tooltips Example Listing By Scott Andrew if elm.addEventListener elm.addEventListener evType fn useCapture return true else if elm.attachEvent var r elm.attachEvent on evType fn return r else elm on evType fn init function get the header links if Idocument.getElementsByTagName document.getElementById return var navList document.getElementByld nav rH.links navList.getElementsByTagName a var extra document.getElementByld extra for var i 0 i rH.links.length i install event listeners rH.addEvent rH.links i mouseover rH.mOver false rH.addEvent rH.links i mouseout rH.mOut false move the corresponding span into the extra div var theLi rH.links i .parentNode var theSpan theLi.getElementsByTagName span 0 extra.appendChild theSpan theSpan.style.display block remember where the span is and what s happening rH.links i .tipSpan theSpan rH.links i .tipState none setInterval rH.moveLinks 50 test with 500 mOver function e var link if e e.target 121 Licensed to siowchen@darke.biz Chapter 5 Animation link e.target if window.event window.event.srcElement link window.event.srcElement if link return if link.nodeType 3 link link.parentNode Fix for Safari if link.tipState full link.tipState rising mOut function e var link if e e.target link e.target if window.event window.event.srcElement link window.event.srcElement if link return if link.nodeType 3 link link.parentNode