1. Technology

Dynamic HTML Attributes

Attributes of XHTML Tags for DHTML - onclick onmouseover

By

When you set out to write dynamic HTML, you need to understand the different ways you can impact the elements on the page. Usually, the elements can have one or more of the following attributes that indicate an action moment in reference to the page. Once you've decided when you want a dynamic action to occur, you add your scripting language to one of these attributes and make that element dynamic.

Some Notes

The most common way to write these attributes is with a mixed case, but with XHTML, attributes should be written in lower case. This means that onclick and OnClick mean the same thing, but onclick is valid XHTML.

Also, this article will not teach you scripts to use with these attributes. Check out the JavaScript site at About for help with actual scripts.

Finally, while these attributes are valid, not all browsers support them in the same ways, so be sure to test your scripts before releasing them.

Mouse Related Events

onclick
The onclick attribute is one of the most commonly used DHTML attributes. It tells the browser to implement the script when the element is clicked on with the mouse or pointer.

The onclick attribute works with all elements except: applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

ondblclick
Like the onclick attribute, the ondblclick attribute takes effect when the element is double clicked on. This is not as commonly found on Web pages, but can give your Web page the same functionality as an OS icon.

The ondblclick attribute works with all elements except: applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

onmousedown
The onmousedown attribute activates when a mouse or pointer button is pressed down on the element.

The onmousedown attribute works with all elements but applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

onmouseup
The onmouseup attribute activates when a mouse or pointer button is released on the element.

The onmouseup attribute works with all elements but applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

onmousemove
The onmousemove attribute activates when a mouse or pointer is moved within the element.

The onmousemove attribute works with all elements but applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

onmouseout
The onmouseout attribute activates when a mouse or pointer is moved off of the element.

The onmouseout attribute works with all elements but applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

onmouseover
The onmouseover attribute activates when a mouse or pointer is moved onto the element.

The onmouseover attribute works with all elements but applet, base, basefont, bdo, br, font, frame, frameset, head, html, iframe, isindex, meta, param, script, style, and title.

Review focus, form, page, and frame related events on page 2.

©2014 About.com. All rights reserved.