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

Lightフィルタ

光源の種類･･･→ ---

Lightフィルタ（光源）

光源の種類

  1. [Ambient光源］･･･オブジェクト全体に指定された色・強さの光を当てる
  2. [Point光源］　･･･オブジェクトの一部が光源から照らされる
  3. [Cone光源］　 ･･･設定された位置・強さ・色・広がりのスポットライトをオブジェクトに当てる


Lightフィルタ適用の手順

  1. オブジェクトのstyleにLightフィルタを設定
    　・(style属性で設定する場合）style="filter:light"
    　・(Scriptで設定する場合）オブジェクト.style.filter = "light()";
  2. Scriptで光源の種類を指定
    　・addAmbient()メソッド、addPoint()メソッド、addCone()メソッドを使う

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

<script language="JavaScript"><!--
function FilLightA(){
  LightClear();
  pic.style.filter = "light()";
  pic.filters.item(0).addAmbient(150,50,0,200);
}
function FilLightP(){
  LightClear();
  pic.style.filter = "light()";
  pic.filters.item(0).addPoint(100,60,40,150,200,150,200);
}
function FilLightC(){
  LightClear();
  pic.style.filter = "light()";
  pic.filters[0].addCone(20,-20,1,150,150,200,200,200,50,15);
}
function LightClear(){    //ﾌｨﾙﾀの解除
  pic.style.filter = "nothing";
}
//--></script>
</head>
<body>
<form>
  光源の種類･･･→
    <input type="button" value="Ambient光源" onclick="FilLightA();"> 
    <input type="button" value="Point光源" onclick="FilLightP();"> 
    <input type="button" value="Cone光源" onclick="FilLightC();"></p>
    <input type="button" value="光源のクリア" onclick="LightClear();">
</form>
<img id="pic" src="../../java/jadata/ja02a.jpg" WIDTH="200" HEIGHT="150">

end(01/11/05)

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