Weblabor

(function (window, document, tag, className) {
  var elems = document.getElementsByTagName(tag), // Kigyűjtjük a képeket
      elemNum = elems.length,                     // Képek száma
      i = 0,
      elem,

      setOpacity = function () {
        var div = document.createElement("div"),
            a,
            support;

        div.style.display = "none";
        div.innerHTML = "<a href='/a' style='opacity:.55;'>a</a>";
        a = div.getElementsByTagName("a")[0];
        support = /^0.55$/.test(a.style.opacity);

        return function (elm, value) {
          var style = elm.style || '',
              filter = style.filter || '',
              ralpha = /alpha\([^)]*\)/,
              ropacity = /opacity=([^)]*)/,
              opacity = parseInt(value, 10);


          if (!support) {
            opacity = opacity + '' === 'NaN' ? '' : "alpha(opacity=" + value + ")";
            style.filter = ralpha.test(filter) ? filter.replace(ralpha, opacity) : opacity;
          }
          else {
            style.opacity = (opacity + '' === 'NaN' ? 1 : opacity) / 100;
          }
        };
      }(),

      getEventTarget = function (event) {
        var target;

        if (!event) {
          event = window.event;
        }
        if (event.target) {
          target = event.target;
        }
        else if (event.srcElement) {
          target = event.srcElement;
        }
        if (target.nodeType == 3) {
          target = target.parentNode;
        }
        return target;
      },

      // Generálunk egy speciális setOpacity függvényt,
      // amiben meg van már adva az átlátszóság
      setOpacityGen = function (opacity) {
        return function (event) {
          setOpacity(getEventTarget(event), opacity);
        };
      },

      // Böngésző független esemény hozzácsatolás (messze nem tökéletes)
      addEvent = function (elm, evt, func) {
        if (elm.addEventListener) {
          elm.addEventListener(evt, func, false);
        }
        else if (elm.attachEvent) {
          elm.attachEvent(('on' + evt), func);
        }
        else {
          elm['on' + evt] = func;
        }
      };


  // Végigszaladunk a képeken, és hozzáadjuk a képekhez az eseménykezelőket.
  for (; i < elemNum; i += 1) {
    elem = elems[i];
    if (elem.className && className.test(elem.className)) {
      addEvent(elem, 'mouseover', setOpacityGen(100));
      addEvent(elem, 'mouseout', setOpacityGen(60));
      addEvent(elem, 'load', setOpacityGen(60));
    }
  }

}(this, document, 'img', /(?:^|\s)thumb(?:$|\s)/));

(function ($) {
  $(function () {
    $('.thumb').bind('mouseover mouseout load', function (event) { 
      $(this).css('opacity', event.type == 'mouseover' ? 1 : .6) 
    });
  });
}(jQuery));