COP 3813 Intro to Internet Computing Prof. Roy Levow Lecture 7 DHTML Intro

Dynamic HTML Warning! Microsoft DHTML and Netscape DHTML are different They are not compatable Examples run under IE but not Netscape

Dynamic HTML Object Model XHTML elements can be treated as objects Their XHTML attributes become properties of the objects The properties can be manipulated by scripts for dynamic effect The id attribute defines the object name Example: reference.html

Collections all and children A collection is basically an array of related objects The ‘all’ collection consists of all XHTML elements of a document The ‘children’ collection of an object consists of all the immediately contained elements Examples: all.html, children.html

Dynamic Styles Styles can change dynamically Example: dynamicstyle.htlm Font attributes can change dynamically Example: dynamicstyle2.html Position can change dynamically Example: dynamicposition.html

DHTML Events The script tag can contain an event attribute with a script to execute as its value The action can be limited by the ‘for’ attribute. Example: onclick.html On load is triggered when page loads Example: onload.html

Error Handling The onerror attribute specifies a function to execute if there is an error Three parameters: errType, errURL, errLineNum Passed by system Example onerror.html

Mouse Events onmousemove provides event object properties include button clientX/clientY – position in client window offsetX/offsetY – position in current object screenX/screenY – screen position cancelBubble – events bubble up from innermost object Example: onmousemove.html

Rollovers onmouseover, onmouseout Event bubling Example: onmouseoverout.html Event bubling Example: bubbling.html