This script is little. But it is very useful. I use it in nearly every form I make!

onclick="javascript:this.value='';" onblur="javascript:if(this.value==''){this.value=this.getAttribute('value');}"

That's it!

It even works with password boxes, with this script:

onclick="javascript:this.value='';this.type='password';" onblur="javascript:if(this.value==''){this.value=this.getAttribute('value');this.type='text';}"

I believe the password one doesn't work with IE, though.

Simply add this to an input box with a value set, and when the user clicks on it, it will disappear, and if it's left as nothing when they deselect the box, it goes back to the original!

I personally dont like using background images for the body..
Any page movement will fcuk up any divs above it.

I tend to create a "main" div that centred and then put all divs inside that main div.

Then add a BG to the main div and if the page moves all your divs move with it.

Just my 0.02$

Umm... I think you're on the wrong thread lynxus... That made NO sense.

The snag there is that if the user re-focuses the field to amend an entry, it gets deleted.

This is a common way to handle it:

<input type="text" size="30" name="uName"  value='Your name' onfocus='if( this.value == this.defaultValue ){ this.value = "";}' onblur='if( !/\S/.test( this.value ) ){ this.value = this.defaultValue; }'>

although it's better done unobtrusively:

<script type='text/javascript'>

function clearFields( formRef )
{
 var elems = formRef.elements, len = elems.length;  
 
 for( var i = 0; i < len; i++ )
  if( elems[ i ].type && /^text/.test( elems[ i ].type ) )
  {
   elems[ i ].onfocus = function(){ if( this.value == this.defaultValue ){ this.value = ""; } }
   elems[ i ].onblur = function(){ if( !/\S/.test( this.value ) ){ this.value = this.defaultValue; } }     
  }   
}

clearFields( document.getElementById( 'myForm' ) );

</script>