|
From http://www.htmlcenter.com/
Dynamic content
|
See, text is being dynamically generated and erased, without the need to reload the document! |
Put your mouse all over me...
<td onmouseover="this.style.backgroundColor='yellow';
this.style.color='darkred';
this.style.fontWeight='Bold';
this.style.fontStyle='Italic';
if(document.all){
document.all.myTable.border=20;
};">Put your mouse all over me...</td>
| |
New in HTML 4.0 is the ability for a TABLE itself to be active in terms of the mouse and keyboard. The TABLE flag can now accept and render the Event Handlers: onBlur, onClick, onDblClick, onDragStart, onFocus, onKeyDown, onKeyPress, onKeyUp, onMouseDown, onMouseMove, onMouseOut, onMouseOver, onMouseUp, and onScroll.
Here's what it looks like:
<TABLE border="1" bordercolor=blue
cellspacing="0" cellpadding="5"
onClick="alert('This is the Example Table')">
<CAPTION><EM>A test table with click effect</EM></CAPTION>
<TR>
<TD>Cell Data</TD>
<TD>Click me</TD>
</TR>
</TABLE>
|
| |
...and here's the effect:
A test table with click effect
Cell Data |
Click me |
|
Give any table a "rollover" personality with the script at the start of this page. Using it, you can allow the cells of any given table to change color when the mouse rolls over them. This example uses some JavaScript and flashes instead
<table border="0" id="myexample"
style="border:5px solid green">
<tr><td>Insert anything you want
into this table. Insert anything you want
into this table.</td>
</tr></table>
<script language="JavaScript1.2">
<!--
/*
Flashing Table Border Script-
© Dynamic Drive (www.dynamicdrive.com)
For full source code, and Terms Of
Use, visit dynamicdrive.com
*/
function flashit(){
if (!document.all)
return
if (myexample.style.borderColor=="green")
myexample.style.borderColor="red"
else
myexample.style.borderColor="green"
}
setInterval("flashit()", 1000)
//-->
</script> |
Insert anything you want into this table. Blinks red and green with Internet Explorer but not with Mozilla.
| |
|
|