function displayimage(viewer, image, effect) {
     switch (effect) {
     case 3: filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0, Duration=0.7, Motion=reverse, wipeStyle=1)"; break
     case 2: filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0, Duration=0.7, wipeStyle=1)"; break
     case 1: filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0, Duration=0.7, Motion=reverse)"; break
     default: filterstring="progid:DXImageTransform.Microsoft.GradientWipe(GradientSize=1.0, Duration=0.7)"; break
     }
     if (document.getElementById) {
          var imgobj=document.getElementById(viewer)
          if (imgobj.filters && window.createPopup) {
               imgobj.style.filter=filterstring
               imgobj.filters[0].Apply()
          }
          imgobj.innerHTML="<img src='"+image+"' border='0'>"
          if (imgobj.filters && window.createPopup) imgobj.filters[0].Play()
          return false
     }
}

</script>

<DIV ID="viewer" STYLE="position:absolute; top: 50px; left: 20px; width: 300px; height:300px" align="center"></DIV>

<a href="#" onclick="displayimage('viewer', '1.jpg', 0)">1</a>
<a href="#" onclick="displayimage('viewer', '2.jpg', 1)">2</a>
<a href="#" onclick="displayimage('viewer', '3.jpg', 2)">3</a>
<a href="#" onclick="displayimage('viewer', '4.jpg', 2)">4</a>