Filter一覧(no2)
選択ボックスでフィルタを選択すれば適用できます。その時の設定内容も表示される。

梅と鶯
FILTER
★同時に複数のフィルタを適用できます。
選択ボックスでフィルタを選択すれば適用できます。その時の設定内容も表示される。
★同時に複数のフィルタを適用できます。
Sample Source......................................................................>>>
<script language="JavaScript"><!--
function Fil(f){
dv.style.filter=f;
//filterを適用
fil.innerText = f;
//filter設定内容を表示
}
function Fil2(f){
dv.style.filter=f;
fil.innerText = f;
}
//--></script>
</head>
<body>
<select onChange="Fil(this.value)">
<option selected value>filter無し</option>
<option value="xray()">xray(X線)
</option>
<option value="gray()">gray(グレー)
</option>
<option value="invert()">invert(色反転)
</option>
<option value="flipH()">flipH(左右反転)
</option>
<option value="flipV()">flipV(上下反転)
</option>
<option value="shadow(color=#63418B,direction=45)">
shadow(陰影) </option>
<option value="dropshadow(color=#6688A6,
offX=10,offY=10,positive=1)">dropshadow
</option>
<option value="glow(color=pink,strength=8)">
glow(発光) </option>
<option value="blur(add=1,direction=315,strength=8)">
blur(ブレ) </option>
<option value="wave(add=0,freq=4,lightstrength=80,
phase=50,strength=6)">wave(波動)
</option>
<option value="alpha(opacity=30)">alpha(透明度)
</option>
<option value="chroma(color=green)">Chromakey
</option>
<option value="mask(color=black)">黒色でmask
</option>
</select>
<div id="dv" style="width:70%">
<img style="float:left" id="pic"
src="../../images/cut/025.gif" width="103"
height="116">
<span style="width:200;color:magenta;
font:30pt 'DF勘亭流'">梅と鶯</span><br>
<span id="sp" style="width:200;color:green;
font:30pt 'Broadway BT'">FILTER</span>
</div>
<fieldset style="border:double blue;background-color:mistyrose;">
<legend style="color:red;font:16;">現在のfilter設定内容</legend>
<span id="fil">(Filterの設定内容を表示)</span>
</fieldset>
<p>★同時に複数のフィルターを適用できます。</p>
<select onChange="Fil2(this.value)">
<option selected value>filter無し
<option value="invert() glow(color=pink,strength=8)">
invert(色反転)とglow(発光)
<option value="shadow(color=#63418B,direction=45)
wave(add=0,freq=4,lightstrength=80,phase=50,strength=6)">
shadow(陰影)とwave(波動)
<option value="flipH()
shadow(color=#63418B,direction=45)
glow(color=pink,strength=8)">上下反転と陰影と発光
・・・(他は省略)・・・
</select> </p>
end(最終更新:12/11/10)