Untitled

Copy and paste the codes into your page. See the working example below to see how it works.
Click Here

Note title

POST NOTE MESSAGE - ADD WHATEVER TEXT YOU WANT TO APPEAR ON YOUR POST NOTE - If you want more then one post note on the same page, you have to change the post note number 1 to another number.

Paste this in between your head tags.

<style>
.note { border: 1px solid #888888; font: 9px caption; font-weight: bold; background: #C0C0C0; text-decoration:none; color: #000000;}
A.note { text-decoration: none; }
.notebody { display:block; border: 1px solid #C0C0C0; color: #000000; background: #C0C0C0; position:absolute; z-index: +10; width:200px; padding: 2px; left: 50px; font-size: 12px;}
.notetitle { font-weight: bold; background: #DBD7D7; color: #000000; border-bottom: 1px dashed #DBD7D7; padding: 1px; width: 100%; margin: 0px;  font-size: 13px;}
.notehidden { display: none; }
.notevisible { display: block; position:absolute; z-index: +10; left:0px;}
</style>
<script language="javascript">
var ie = false;
var lastNote = '';
if (document.all) { ie = true; }
 
 function getObj(id) {
  if (ie) {
   return document.all[id];
  } else {
   return document.getElementById(id);
  }
 }
 
 function showNote(name) {
  if (name == lastNote) {
   hideNote(name);
   return;
  }
 
  if (lastNote != '') { hideNote(lastNote); }
  var title = getObj(name + '_title');
  var body = getObj(name + '_body');
  //title.className = 'notehidden';
  body.className = 'notevisible';
  lastNote = name;
 }
 
 function hideNote(name) {
  var title = getObj(name + '_title');
  var body = getObj(name + '_body');
  //title.className = 'note';
  body.className = 'notehidden';
  lastNote = '';
 }
</script>

Paste this in between your body tags.