clipLeft증가 clipLeft감소

결과 표시창

<STYLE>.butClass{width:150}</STYLE>
<SCRIPT>
size=100;
function setClip(job){
  if (job=='+'){
    if (size<290) size=size+10;
    else size=300;
  }
  if (job=='-'){
    if (size>10) size=size-10;
    else size=0;
  }
  imgObj.style.clip='rect(auto auto auto '+size+')';
  str='imgObj.style.clip='+imgObj.style.clip+'<BR>';
  str+='imgObj.currentStyle.clipTop='+imgObj.currentStyle.clipTop+'<BR>';
  str+='imgObj.currentStyle.clipBottom='+imgObj.currentStyle.clipBottom+'<BR>';
  str+='imgObj.currentStyle.clipLeft='+imgObj.currentStyle.clipLeft+'<BR>';
  str+='imgObj.currentStyle.clipRight='+imgObj.currentStyle.clipRight+'<BR>';
  showA.innerHTML=str;
}
</SCRIPT>
<IMG id="imgObj" src="../../gif/flower.jpg" width="300" style="position:absolute;left:430;clip:rect(auto auto auto 100)">
<IMG src="../../gif/flower.jpg" width="300"><BR>
<BUTTON onclick=setClip('+') class=butClass>clipLeft증가</BUTTON>
<BUTTON onclick=setClip('-') class=butClass>clipLeft감소</BUTTON><BR>
<DIV id="showA" style="width:610;height:6.8em;border:solid 1 blue;padding:5">결과 표시창</DIV>