function protect_images(){
  for(var i = 0; i<document.images.length; i++){
    if(imgLoaded(document.images[i])==false){
      all_images_rdy = false;
    }
    else{
      all_images_rdy = true;
    }
  }
  if (all_images_rdy==true){
    protect_images_now()
  }
  else{
    window.setTimeout('protect_images()', 100);
  }
}
function protect_images_now(){
var overlay_image = "files/transparenz.gif";
var overlay = new Array();
var parent_nodes = new Array();
var container = new Array();
var original_image = new Array();
var image_height = new Array();
var image_width = new Array();
var count = 0;

  for(var i = 0; i<document.images.length; i++){
      //Container for the original image and the transparent overlay
      container[i] = document.createElement('span');
      container[i].setAttribute('id', 'prot_' +i);
      count++;
      
      //only get css style if there are any
      if(document.images[i].getAttribute('style') != null){
        //Modern Browsers return css styles as a string
        if(typeof document.images[i].getAttribute('style') == 'string'){
          css_style=document.images[i].getAttribute('style');
          tmp_float = document.images[i].style.cssFloat;
          container[i].setAttribute('style', css_style);
          document.images[i].setAttribute('style', '');
          document.images[i].style.cssFloat = tmp_float;
        }
        
        //Internet Explorer doesn't
        else{
          css_style=document.images[i].getAttribute('style').cssText;
          container[i].style.cssText=css_style;
          tmp_float = document.images[i].styleFloat;
          document.images[i].style.cssText = '';
          document.images[i].styleFloat = tmp_float;
        }
      }
      //the container needs to be positioned relative to keep it at the right place
      container[i].style.position="relative";


      //we position the original image relative
      document.images[i].style.position='relative';
      
      //and set its Z-Index to 1
      document.images[i].style.zIndex='1';
      
      //copy the parent node of the original image into our container (just in case it's in a tag we need (i.e. links))
      container[i].appendChild(document.images[i].parentNode.cloneNode(true));
      
      //we need a reference to our original image if we want to have the title- and alt-tags
      original_image[i] = document.images[i];
      //store the images width and height for later use
      image_height[i] = document.images[i].height;
      image_width[i] = document.images[i].width;

      //replace the original images parent with our new div
      document.images[i].parentNode.parentNode.replaceChild(container[i], document.images[i].parentNode);
  }
  //lets append our overlay images
  for(var i = 0; i < count; i++){
  
      //create our overlay image and set its attributes
      overlay_img = document.createElement('img');
      overlay_img.setAttribute('src', overlay_image);
      overlay_img.setAttribute('alt', original_image[i].alt);
      overlay_img.setAttribute('title', original_image[i].title);
      overlay_img.setAttribute('height', image_height[i]);
      overlay_img.setAttribute('width', image_width[i]);
      overlay_img.setAttribute('border', '0');
      overlay_img.style.zIndex='2';
      overlay_img.style.position = 'absolute';
      overlay_img.style.bottom="4px"
      overlay_img.style.left="0"
      
      document.getElementById('prot_' + i).firstChild.appendChild(overlay_img);
  }
}

function imgLoaded(img) {
  if (!img.complete) {
  return false;
  }

  if (typeof img.naturalWidth
  != 'undefined' && img.naturalWidth
  == 0) {
  return false;
}
return true;
}
