1。将以下代码复制到您的主页中以及主页之间。
〈STYLE〉.shadow {
FILTER: 阴影(颜色=蓝色, 方向=225)
}
.shadow1 {
FILTER: 阴影(颜色=红色, 方向=225)
}
.shadow2 {
FILTER:阴影(颜色=绿色,方向=225)
}
.div {
光标:移动;滤镜:模糊(add=ture, 方向=135,强度=10);宽度:800px
}
〈/风格〉
此处应用模糊滤镜。
2。将图片插入页面中。例如,我插入了
在我们刚刚插入的图像旁边的行中添加
。
<脚本语言=Javascript>
var g_numlights=0;
var Blulbs= new Array("当前的动态滤镜让网页更具交互性来响应用户操作。","我们使用灯光滤镜来响应用户点击,点击图像可以增加光源。","通过捕获用户鼠标的位置来移动光源。","不需要太多编程。");
window.onload=setlights;
document.onclick=keyhandler;
flttgt.onmousemove =鼠标处理程序;
函数setlights(){
flttgt.filters[0].clear();
flttgt.filters[0].addcone(0, 0, 5, 100, 100, 225, 225 , 0 , 60, 15);
if (g_numlights>0){
flttgt.filters[0].addcone(400,170,5,100,100,225,0,0,160,15);
if (g_numlights>1) {
flttgt.filters[0].addcone(320,330,5,100,100,0,225,225,60,15);
}
}
}
功能键处理程序()
{
g_numlights=(g_numlights+=1)%4;
holder.innerHTML=blurbs[g_numlights];
setlights();
}
函数 mousehandler()
{
x=( window.event.x-80);
y=(window.event.y-80);
flttgt.filters[0].movelight(1,x,y,5,1);
if(g_numlights>0){
flttgt.filters[0].movelight(1,x,y,5,1);
if(g_numlights>1)
{
flttgt.filters[ 0].movelight(2,x,y,5,1);
}
}
}
〈/脚本〉
这样可以设置更个性化的图片特效