Producing web pages
* HTML CSS DHTML XHTML A to Z of tags        Accessibility          Design

Dynamic HTML examples

The kind of things you can do in DHTML are change the appearance of links when you move over them, collapse and expand bits of text, and change pictures when you move the mouse over them.

I've collected together a few examples. You can:

  • Add a script to your page that automatically shows the date on which you last updated the page
  • Change a picture when you move the mouse over it
  • Use the <style> tag to make the appearance of links change when you move the mouse over them
  • Make a message to appear in the status bar of the browser window when you move the mouse over a link
  • Display a page in a new window when you click on a link
  • Produce expanding and contracting outlines. This allows you to have headings or short paragraphs on a page that expand to give more information when you click on them
  • Use a button to run a script when you click on it
  • Run a script using the <a> tag combined with a custom URL type. This executes a script when you click a link

I should also probably tell you that the code won't necessarily work on all browsers and that Dynamic HTML relies heavily on javascript and style sheets. You also need the up-to-date browsers not ancient technology like IE3.

If you want lots of examples (and you can pinch the code because it is free), you should have a look at the http://dynamicdrive.com site.