Ajax Layer JavaScript DHTML



JavaScript Widgets -- Examples/Notes

href="noteBasedonJavascript_files/system.css" type=text/css rel=stylesheet>
src="noteBasedonJavascript_files/browser.js">
  
src="noteBasedonJavascript_files/layers.js">
  
src="noteBasedonJavascript_files/brmenu.js">
  
src="noteBasedonJavascript_files/menu.js">
  
src="noteBasedonJavascript_files/site-map.js">
  
P {
  TEXT-ALIGN: justify
}
DIV.pad50 {
  MARGIN-LEFT: 50px; MARGIN-RIGHT: 50px
}
DIV.centered {
  TEXT-ALIGN: center
}
STRONG {
  COLOR: blue
}
TH.list {
  PADDING-RIGHT: 10px; PADDING-LEFT: 10px
}
TD.list {
  PADDING-RIGHT: 10px; PADDING-LEFT: 10px
}
A {
  FONT-WEIGHT: bold; COLOR: blue; FONT-STYLE: normal
}
A:hover {
  FONT-WEIGHT: bold; COLOR: red; FONT-STYLE: normal
}

src="noteBasedonJavascript_files/notes.js">
  

  
  

onload=initialize();>



style="LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 100px">

Examples/Notes


The following example shows how dynamic footnotes might be included in a 
document... 


Any browser-specific comments can be found in brackets here --



 


In a typical paragraph with footnotes, there is a bunch of text, followed by 
a note. The note is represented, as here, by a hypertext name=link>. That link should, as a matter of style, be indicated in the form 
of a number, as here . Footnotes can, with some 
browsers, be set up with a timeout feature, as with this name=timed>link. I have set this one to time out after 4 seconds. To test 
this feature properly in a variety of browsers, I have inserted notes that 
appear in those browsers. 


This first footnote is 
activated by moving the mouse over the "link" a-link. I have set the width of 
this footnote to 400 pixels. 

This second example is 
activated by moving the mouse over the "2" a-link. I have set the width of this 
footnote to 300 pixels. 

This third 
example is actived by moving the mouse over the "timed" a-link. I have set this 
one up to have a 4-second hold time. 

           
       
jswidgets-0.9-4.zip( 18 k)