this.imagelink = function() {
  // [BEGIN CONFIG -->]
  // You can apply various styles to various images on site
  // the style "groups" consist of 3 elements:
  // 1. css class of images that you wish to apply style to
  // 2. css class that defines how span that covers the image is styled by default
  // 3. css class that defines how span that covers the image is styled when rolled over
  //
  // use as many variations as you want, just set the css class to images in html


  // [image css class, covering span default css class, covering span mouseover css class]
  var arr = [
        ["play", "", "playOver"]
        /*
        ,["play_2", "playOut_2", "playOver_2"]
        ,["play_3", "", "playOver_3"]
        ,["play_4", "", "playOver_4"]
        ,["play_5", "", "playOver_5"]
        */
        ];
  // [<-- END CONFIG]

  for (var x = 0; x < arr.length; x++) {
    var a = document.getElementsByTagName("a");
    for (var i = 0; i < a.length; i++) {
      var img = a[i].getElementsByTagName("img");
      for (var j = 0; j < img.length; j++) {
      	if (img[j].className.indexOf(arr[x][0]) >= 0 || arr[x][0] == "") {
          a[i].style.position = "static";
          if (a[i].getElementsByTagName("span").length > 0)
            a[i].removeChild(a[i].getElementsByTagName("span")[0]);
          var span = document.createElement("span");
          var image = img[j];
          span.style.position = "absolute";
          span.style.top = Position.get(image).top + "px";
          span.style.left = Position.get(image).left + "px";
          //span.style.top = image.offsetTop + "px";
          //span.style.left = image.offsetLeft + "px";
          span.style.width = image.offsetWidth + "px";
          span.style.height = image.offsetHeight + "px";
          span.style.zIndex = 999;
          span.style.cursor = "pointer";
          span.out = span.className = arr[x][1];
          span.over = arr[x][2];
          span.a = img[j].a = a[i];
          span.j = img[j].j = j;
          a[i]["span" + j] = span;
          span.onmouseover = img[j].onmouseover = function(){
            this.a["span" + this.j].className = this.a["span" + this.j].over;
          };
          span.onmouseout = img[j].onmouseout = function(){
            this.a["span" + this.j].className = this.a["span" + this.j].out;
          };
          a[i].appendChild(span);
        };
      };
    };

  };
};

// Script initiates on page load
this.addEvent = function(obj, type, fn){
  if (obj.attachEvent) {
    obj['e' + type + fn] = fn;
    obj[type + fn] = function() { obj['e' + type + fn](window.event); }
    obj.attachEvent('on' + type, obj[type + fn]);
  } else {
    obj.addEventListener(type, fn, false);
  };
};
addEvent(window, "load", imagelink);
addEvent(window, "resize", imagelink);
