ホームページ制作専門会社LMAT Designサイトにようこそ! JAVAスクリプト、CGI検索、ホスティングなどTOTALサポート
ホーム | サイトポリシー | 個人情報 | 著作権 | リンク | 広告掲載 | お問い合わせ | 会社案内 |
ルマットお役たち倉庫 ホスティング オンオフライン制作 カスタマーセンター
loading ...

デザイナー無料求人 グラフィカルジョブ
clipping効果 2
<script language="JavaScript">
 
<!--
 
function namosw_page_width()
 
{
 
  return (navigator.appName == 'Netscape') ? innerWidth  : document.body.offsetWidth;
 
}
 
function namosw_page_height()
 
{
 
  return (navigator.appName == 'Netscape') ? innerHeight : document.body.offsetHeight;
 
}
 
function namosw_init_clip_effect()
 
{
 
  var rect_left, rect_top, rect_width, rect_height;
 
  var type, color;
 
  var width, height;
 
  var arguments = namosw_init_clip_effect.arguments;
 
  if (arguments[0] == 0 && arguments.length == 3) {
 
    rect_left   = 0;
 
    rect_top    = 0;
 
    rect_width  = namosw_page_width();
 
    rect_height = namosw_page_height();
 
    type  = arguments[1];
 
    color = arguments[2];
 
  } else if (arguments[0] == 1 && arguments.length == 4) {
 
    var layer;
 
    if (navigator.appName == 'Netscape') {
 
      layer = document.layers[arguments[1]];
 
      if (layer) {
 
        rect_left   = layer.clip.left;
 
        rect_top    = layer.clip.top;
 
        rect_width  = layer.clip.width;
 
        rect_height = layer.clip.height;
 
      } else {
 
        return;
 
      }
 
    } else {
 
      layer = document.all[arguments[1]];
 
      if (layer) {
 
        rect_left   = layer.style.pixelLeft;
 
        rect_top    = layer.style.pixelTop;
 
        rect_width  = layer.style.pixelWidth;
 
        rect_height = layer.style.pixelHeight;
 
      } else {
 
        return;
 
      }
 
    }
 
    type  = arguments[2];
 
    color = arguments[3];
 
  } else if (arguments[0] == 2 && arguments.length == 7) {
 
    rect_left   = arguments[1];
 
    rect_top    = arguments[2];
 
    rect_width  = arguments[3];
 
    rect_height = arguments[4];
 
    type        = arguments[5];
 
    color       = arguments[6];
 
  } else {
 
    return;
 
  }
 
  window._cl_style     = new Array();
 
  window._cl_interval  = 0;
 
  window._cl_count     = 0;
 
  window._cl_max_count = 40;
 
  if (type == 0) 
 
    window._cl_number = 8;
 
  else if (type == 1) 
 
    window._cl_number = Math.min(64, Math.ceil(rect_height/10));
 
  else if (type == 2) 
 
    window._cl_number = Math.min(64, Math.ceil(rect_width/10));
 
  
 
  window._cl_rect_left   = rect_left;
 
  window._cl_rect_top    = rect_top;
 
  window._cl_rect_width  = rect_width;
 
  window._cl_rect_height = rect_height;
 
  if (type == 0) {
 
    width  = Math.floor(rect_width  / window._cl_number);
 
    height = Math.floor(rect_height / window._cl_number);
 
    for (i = 0; i < window._cl_number*window._cl_number; i++) {
 
      if (navigator.appName == 'Netscape') {
 
        window._cl_style[i] = eval("document.layers.namoswcliplayer"+i)
 
        window._cl_style[i].clip.width  = width;
 
        window._cl_style[i].clip.height = height;
 
        window._cl_style[i].left = rect_left + (i%window._cl_number) * width;
 
        window._cl_style[i].top  = rect_top  + Math.floor(i/window._cl_number) * height;
 
        window._cl_style[i].bgColor = color;
 
      } else {
 
        window._cl_style[i] = eval("document.all.namoswcliplayer" + i + ".style");
 
        window._cl_style[i].pixelWidth  = width;
 
        window._cl_style[i].pixelHeight = height;
 
        window._cl_style[i].pixelLeft = rect_left + (i%window._cl_number) * width;
 
        window._cl_style[i].pixelTop  = rect_top  + Math.floor(i/window._cl_number) * height;
 
        window._cl_style[i].backgroundColor = color;
 
      }
 
    }
 
    window._cl_interval = setInterval("namosw_cl_remove_box()", 10);
 
  } else if (type == 1) {
 
    height = rect_height / window._cl_number;
 
    for (i = 0; i < window._cl_number; i++) {
 
      if (navigator.appName == 'Netscape') {
 
        window._cl_style[i] = eval("document.layers.namoswcliplayer"+i)
 
        window._cl_style[i].clip.width  = rect_width;
 
        window._cl_style[i].clip.height = height;
 
        window._cl_style[i].left = rect_left;
 
        window._cl_style[i].top  = rect_top  + i*height;
 
        window._cl_style[i].bgColor = color;
 
      } else {
 
        window._cl_style[i] = eval("document.all.namoswcliplayer" + i + ".style");
 
        window._cl_style[i].pixelWidth  = rect_width;
 
        window._cl_style[i].pixelHeight = height;
 
        window._cl_style[i].pixelLeft = rect_left;
 
        window._cl_style[i].pixelTop  = rect_top  + i*height;
 
        window._cl_style[i].clip = "rect(0 " + rect_width + " " + height + " 0)";
 
        window._cl_style[i].backgroundColor = color;
 
      }
 
    }
 
    window._cl_interval = setInterval("namosw_cl_change_clip1()", 10);
 
  } else if (type == 2) {
 
    width = rect_width / window._cl_number;
 
    for (i = 0; i < window._cl_number; i++) {
 
      if (navigator.appName == 'Netscape') {
 
        window._cl_style[i] = eval("document.layers.namoswcliplayer"+i);
 
        window._cl_style[i].clip.width  = width;
 
        window._cl_style[i].clip.height = rect_height;
 
        window._cl_style[i].left = rect_left + i*width;
 
        window._cl_style[i].top  = rect_top;
 
        window._cl_style[i].bgColor = color;
 
      } else {
 
        window._cl_style[i] = eval("document.all.namoswcliplayer" + i + ".style");
 
        window._cl_style[i].pixelWidth  = width;
 
        window._cl_style[i].pixelHeight = rect_height;
 
        window._cl_style[i].pixelLeft = rect_left + i*width;
 
        window._cl_style[i].pixelTop  = rect_top;
 
        window._cl_style[i].clip = "rect(0 " + width + " " + rect_height + " 0)";
 
        window._cl_style[i].backgroundColor = color;
 
      }
 
    }
 
    window._cl_interval = setInterval("namosw_cl_change_clip2()", 10);
 
  } else if (type == 3) {
 
    if (navigator.appName == 'Netscape') {
 
      window._cl_style[0] = eval("document.layers.namoswcliplayer"+0)
 
      window._cl_style[0].clip.width  = rect_width;
 
      window._cl_style[0].clip.height = rect_height;
 
      window._cl_style[0].left = rect_left;
 
      window._cl_style[0].top  = rect_top;
 
      window._cl_style[0].bgColor = color;
 
    } else {
 
      window._cl_style[0] = eval("document.all.namoswcliplayer" + 0 + ".style");
 
      window._cl_style[0].pixelWidth  = rect_width;
 
      window._cl_style[0].pixelHeight = rect_height;
 
      window._cl_style[0].pixelLeft = rect_left;
 
      window._cl_style[0].pixelTop  = rect_top;
 
      window._cl_style[0].backgroundColor = color;
 
    }
 
    window._cl_interval = setInterval("namosw_cl_change_clip3()", 10);
 
  } else if (type == 4 || type == 5 || type == 6) {
 
    if (navigator.appName == 'Netscape') {
 
      if (type == 4 || type == 5) {
 
        window._cl_style[0] = document.layers.namoswcliplayer0;
 
        window._cl_style[0].clip.width  = rect_width/2;
 
        window._cl_style[0].clip.height = rect_height;
 
        window._cl_style[0].left = rect_left;
 
        window._cl_style[0].top  = rect_top;
 
        window._cl_style[0].bgColor = color;
 
        window._cl_style[1] = document.layers.namoswcliplayer1;
 
        window._cl_style[1].clip.width  = rect_width/2;
 
        window._cl_style[1].clip.height = rect_height;
 
        window._cl_style[1].left = rect_left + rect_width/2;
 
        window._cl_style[1].top  = rect_top;
 
        window._cl_style[1].bgColor = color;
 
      }
 
      if (type == 4 || type == 6) {
 
        window._cl_style[2] = document.layers.namoswcliplayer2;
 
        window._cl_style[2].clip.width  = rect_width;
 
        window._cl_style[2].clip.height = rect_height/2;
 
        window._cl_style[2].left = rect_left;
 
        window._cl_style[2].top  = rect_top;
 
        window._cl_style[2].bgColor = color;
 
        window._cl_style[3] = document.layers.namoswcliplayer3;
 
        window._cl_style[3].clip.width  = rect_width;
 
        window._cl_style[3].clip.height = rect_height/2;
 
        window._cl_style[3].left = rect_left;
 
        window._cl_style[3].top  = rect_top + rect_height/2;
 
        window._cl_style[3].bgColor = color;
 
      }
 
    } else {
 
      if (type == 4 || type == 5) {
 
        window._cl_style[0] = document.all.namoswcliplayer0.style;
 
        window._cl_style[0].pixelWidth  = rect_width/2;
 
        window._cl_style[0].pixelHeight = rect_height;
 
        window._cl_style[0].pixelLeft = rect_left;
 
        window._cl_style[0].pixelTop  = rect_top;
 
        window._cl_style[0].clip      = "rect(0" + (rect_width/2) + " " + rect_height + " 0)";
 
        window._cl_style[0].backgroundColor = color;
 
        window._cl_style[1] = document.all.namoswcliplayer1.style;
 
        window._cl_style[1].pixelWidth  = rect_width/2;
 
        window._cl_style[1].pixelHeight = rect_height;
 
        window._cl_style[1].pixelLeft = rect_left + rect_width/2;
 
        window._cl_style[1].pixelTop  = rect_top;
 
        window._cl_style[1].clip      = "rect(0" + (rect_width/2) + " " + rect_height + " 0)";
 
        window._cl_style[1].backgroundColor = color;
 
      }
 
      if (type == 4 || type == 6) {
 
        window._cl_style[2] = document.all.namoswcliplayer2.style;
 
        window._cl_style[2].pixelWidth  = rect_width;
 
        window._cl_style[2].pixelHeight = rect_height/2;
 
        window._cl_style[2].pixelLeft = rect_left;
 
        window._cl_style[2].pixelTop  = rect_top;
 
        window._cl_style[2].clip      = "rect(0" + rect_width + " " + (rect_height/2) + " 0)";
 
        window._cl_style[2].backgroundColor = color;
 
        window._cl_style[3] = document.all.namoswcliplayer3.style;
 
        window._cl_style[3].pixelWidth  = rect_width;
 
        window._cl_style[3].pixelHeight = rect_height/2;
 
        window._cl_style[3].pixelLeft = rect_left;
 
        window._cl_style[3].pixelTop  = rect_top + rect_height/2;
 
        window._cl_style[3].clip      = "rect(0" + rect_width + " " + (rect_height/2) + " 0)";
 
        window._cl_style[3].backgroundColor = color;
 
      }
 
    }
 
    window._cl_interval = setInterval("namosw_cl_change_clip456(" + type + ")", 10);
 
  }
 
}
 
function namosw_cl_change_clip1()
 
{
 
  var height = window._cl_rect_height  / window._cl_number;
 
  window._cl_count += 2;
 
  for (i = 0; i < window._cl_number; i++) {
 
    if (navigator.appName == 'Netscape') {
 
      window._cl_style[i].clip.top  = window._cl_count;
 
    } else {
 
      window._cl_style[i].clip = "rect(" + window._cl_count + " auto " + height + " auto)";
 
    }
 
  }
 
  if (height <= window._cl_count)
 
    clearInterval(window._cl_interval);
 
}
 
function namosw_cl_change_clip2()
 
{
 
  var width = window._cl_rect_width  / window._cl_number;
 
  window._cl_count += 2;
 
  for (i = 0; i < window._cl_number; i++) {
 
    if (navigator.appName == 'Netscape') {
 
      window._cl_style[i].clip.left  = window._cl_count;
 
    } else {
 
      window._cl_style[i].clip = "rect(auto " + width + " auto " + window._cl_count + ")";
 
    }
 
  }
 
  if (width <= window._cl_count)
 
    clearInterval(window._cl_interval);
 
}
 
function namosw_cl_change_clip3()
 
{
 
  var rect_width  = window._cl_rect_width;
 
  var rect_height = window._cl_rect_height;
 
  var x_delta = rect_width/2/window._cl_max_count*window._cl_count;
 
  var y_delta = rect_height/2/window._cl_max_count*window._cl_count;
 
  window._cl_count++;
 
    if (navigator.appName == 'Netscape') {
 
      window._cl_style[0].clip.left = x_delta;
 
      window._cl_style[0].clip.top  = y_delta;
 
      window._cl_style[0].clip.right  = rect_width  - x_delta;
 
      window._cl_style[0].clip.bottom = rect_height - y_delta;
 
    } else {
 
      var top, right, bottom, left;
 
      top    = y_delta;
 
      right  = rect_width - x_delta;
 
      bottom = rect_height - y_delta;
 
      left   = x_delta;
 
      window._cl_style[0].clip = "rect(" + top + " " + right + " " + bottom + " " + left + ")";
 
    }  
 
  if (window._cl_max_count < window._cl_count)
 
    clearInterval(window._cl_interval);
 
}
 
function namosw_cl_change_clip456(type)
 
{
 
  var rect_width  = window._cl_rect_width;
 
  var rect_height = window._cl_rect_height;
 
  var x_delta = rect_width/2/window._cl_max_count*window._cl_count;
 
  var y_delta = rect_height/2/window._cl_max_count*window._cl_count;
 
  window._cl_count++;
 
  if (navigator.appName == 'Netscape') {
 
    if (type == 4 || type == 5) {
 
      window._cl_style[0].clip.right = rect_width/2 - x_delta;
 
      window._cl_style[1].clip.left  = x_delta;
 
    }
 
    if (type == 4 || type == 6) {
 
      window._cl_style[2].clip.bottom = rect_height/2 - y_delta;
 
      window._cl_style[3].clip.top    = y_delta;
 
    }
 
  } else {
 
    var top, right, bottom, left;
 
    right   = rect_width/2 - x_delta;
 
    left    = x_delta;
 
    bottom  = rect_height/2 - y_delta;
 
    top     = y_delta;
 
    if (type == 4 || type == 5) {
 
      window._cl_style[0].clip = "rect(auto " + right + " auto 0)";
 
      window._cl_style[1].clip = "rect(auto " + (rect_width/2) + " auto " + left + ")";
 
    }
 
    if (type == 4 || type == 6) {
 
      window._cl_style[2].clip = "rect(0 auto " + bottom + " auto)";
 
      window._cl_style[3].clip = "rect(" + top + " auto " + (rect_height/2) + " auto)";
 
    }
 
  }  
 
  if (window._cl_max_count < window._cl_count)
 
    clearInterval(window._cl_interval);
 
}
 
function namosw_cl_remove_box() 
 
{
 
  var i;
 
  i = Math.round(Math.random()*(window._cl_number*window._cl_number-1));
 
  while (window._cl_style[i].visibility == 'hidden' || window._cl_style[i].visibility == 'hide') 
 
    i = Math.round(Math.random()*(window._cl_number*window._cl_number-1));
 
  window._cl_style[i].visibility = 'hidden';
 
  window._cl_count++;
 
  if (window._cl_number*window._cl_number <= window._cl_count)
 
    clearInterval(window._cl_interval);
 
}
 
//-->
 
</script>
 
</head>
 
<body OnLoad="namosw_init_clip_effect(0, 1, 'blue');">
 
<p> </p>
 
<div id="namoswcliplayer0" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer1" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer2" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer3" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer4" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer5" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer6" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer7" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer8" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer9" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer10" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer11" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer12" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer13" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer14" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer15" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer16" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer17" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer18" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer19" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer20" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer21" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer22" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer23" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer24" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer25" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer26" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer27" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer28" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer29" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer30" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer31" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer32" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer33" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer34" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer35" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer36" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer37" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer38" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer39" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer40" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer41" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer42" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer43" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer44" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer45" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer46" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer47" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer48" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer49" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer50" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer51" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer52" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer53" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer54" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer55" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer56" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer57" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer58" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer59" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer60" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer61" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer62" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
 
<div id="namoswcliplayer63" style="position:absolute; left:-100; top:-100; z-index:1000;"></div>
前のページに戻る

このエントリーのトラックバック URL: http://www.lmat-d.net/mt/mt-tb.cgi/285

(いままで、ここでコメントしたことがないときは、コメントを表示する前にこのスクリプトのオーナーの承認が必要になることがあります。承認されるまではコメントは表示されません。そのときはしばらく待ってください。)

ホーム | サイトポリシー | 個人情報 | 著作権 | リンク | 広告掲載 | お問い合わせ | 会社案内 |
住所:〒160-0022 東京都新宿区新宿3-3-1 龍王堂ビル4F TEL:050-5532-7564 FAX:03-6385-7561
当サイトはIE7、IE8などの最新ブラウザに最適化されております。当サイトが正しく表示されない場合はブラウザの アップデートお勧めします。