<img src="01.jpg"class="photo,#ff00ff">

<img src="02.jpg"class="photo">

<img src="03.jpg"class="photo"style="position:absolute;top:90;left:200">

<script type="text/javascript"><!--
set_name="photo"  //適応名

function getclass(cl){
var class_obj=new Array();
var ccount=0;
tag_obj=document.getElementsByTagName("IMG");

  for(i=0;i<tag_obj.length;i++){
    var clas=tag_obj[i].className;
    if(clas.indexOf(" ") != -1)clas=clas.split(" ")[0];
    if(clas.indexOf(",") != -1)clas=clas.split(",")[0];

    if(clas == cl){
      class_obj[ccount]=tag_obj[i];
      ccount++;
    }
  }
return class_obj;
}

function imgset(){

pimg = getclass(set_name);

var BaseDiv = new Array();
var BorderDiv =new Array();
var DivShadow = new Array();
var dimg =new Array();
var pot = new Array();
var Shadowset = new Array();
var Borderset = new Array();
var potset = new Array();
var potset2 = new Array();
var imgpar = new Array();
var z = 1;

for (i = 0; i < pimg.length; i++) {

  imgpar[i]=pimg[i].parentNode;
  ih=pimg[i].height;
  iw=pimg[i].width;
var W=(iw > ih)?iw:ih;

  BaseDiv[i] = document.createElement("div");
  BaseDiv[i].style.height = ih;
  BaseDiv[i].style.width = iw;

if(pimg[i].style.position == "absolute"){

  var t=pimg[i].style.top;
  var l=pimg[i].style.left;
  BaseDiv[i].style.position = "absolute";
  BaseDiv[i].style.top = t;
  BaseDiv[i].style.left = l;
  pimg[i].style.position = "static"
}else{
  BaseDiv[i].style.position = "relative";
}

  DivShadow[i] = document.createElement("div");
  DivShadow[i].style.height = (ih-W/10-W/40)+"px";
  DivShadow[i].style.width = (iw-W/10-W/40)+"px";
  DivShadow[i].style.position = "absolute";
  DivShadow[i].style.top = W/40+"px";
  DivShadow[i].style.left = W/40+"px";
  DivShadow[i].style.zIndex = z;z++;
  DivShadow[i].style.border = (W/20)+"px solid #aaaaaa";

  DivShadow[i].style.opacity = 0.5;
  DivShadow[i].style.filter =  "Alpha(opacity=50)";
  DivShadow[i].style.MozOpacity = 0.5;

  BorderDiv[i] = document.createElement("div");
  BorderDiv[i].style.height = (ih-W/10-W/40)+"px";
  BorderDiv[i].style.width = (iw-W/10-W/40)+"px";
  BorderDiv[i].style.position = "relative";
  BorderDiv[i].style.zIndex = z;z++;
  var clas=pimg[i].className;
    if(clas.indexOf(" ") != -1)clas=clas.split(" ")[0];
    if(clas.indexOf(",") != -1)
  BorderDiv[i].style.border = (W/20)+"px solid "+clas.split(",")[1];
    else
  BorderDiv[i].style.border = (W/20)+"px solid #ffffff";

  dimg[i] = document.createElement("img");
  dimg[i].style.height = (ih-W/10-W/40)+"px";
  dimg[i].style.width = (iw-W/10-W/40)+"px";

  pimg[i].style.height = (ih-W/10-W/40)+"px";
  pimg[i].style.width = (iw-W/10-W/40)+"px";
  obj = pimg[i];

  pot[i] = imgpar[i].replaceChild(BaseDiv[i],obj);
  Shadowset[i] = BaseDiv[i].appendChild (DivShadow[i]);
  Borderset[i] = BaseDiv[i].appendChild (BorderDiv[i]);
  potset[i] = BorderDiv[i].appendChild (obj);
  potset2[i] = DivShadow[i].appendChild (dimg[i]);

  }
}
onload=imgset;
/*himajin.moo.jp*/
// --></script>