IE5.5以降のWaveフィルタ書式

　HOME 　>>> 　HTML整理ノート　>>> DHTML -- 基本編　　　応用編

　

Wave

IE5.5以降のWaveフィルタ書式

(HTML)<ELEMENT STYLE="filter:progid:DXImageTransform.Microsoft.Wave(オプション属性)">
(Script)object.style.filter ="progid:DXImageTransform.Microsoft.Wave(オプション属性)"
オプション属性･･･従来と同じ
　freq=　･･･要素の中に現れるWaveの数
　strength=　･･･Waveの強さ（ゆがみの強さ)、(デフォルトは5)
　phase=　･･･通過するWaveは正弦波。この正弦波のオフセットを0～100%で設定。
　lightstrength=　･･･Waveを照らす光の強さを、0～100で設定
　add=　･･･true,1(Waveフィルタをかけた要素だけでなく、元の要素も追加され表示される)
　　　　　 false,0(追加しない、このほうが波動の様子が良くわかる)
　enabled=　･･･true,1(デフォルト、フィルタを有効にする)／false,0（無効にする)、通常は省略する

Sample Source......................................................................>>>

<script language="JavaScript"><!--
w = 0;  //波の数
timerID = "";    //ﾀｲﾏｰ変数
function WaveMove(){
  clearTimeout(timerID);
  w += 7;
  dv.filters[0].phase=w;
  timerID=setTimeout("WaveMove()",80);
}
function WaveStop(){
  w = 0;
  clearTimeout(timerID);
}	
//--></script>
</head>

<body>
<div id="dv" style="position:absolute;filter:progid:DXImageTransform.Microsoft
      .Wave(freq=5,strength=5,phase=50,lightstrength=50,add=0)">
  <img src="../../java/jadata/ja02a.jpg" width="200" height="150">
  <img src="../../images/cut/025.gif" width="103" height="116">
  <span style="color:green;font:60">Wave</span>
</div>
<button onclick="WaveMove()">Waveを動かす</button> 
<button onclick="WaveStop()">止める</button>

end(最終更新:12/11/12)