案例：HTML DOM案例     状态：可编辑再运行    进入竖版
 运行结果　
​x
 
1
<html>
2
<head>
3
<style>
4
div
5
{
6
position:absolute;
7
left:10px;
8
top:100px;
9
width:160px;
10
height:120px;
11
}
12
</style>
13
<script type="text/javascript">
14
function getFilter()
15
{
16
document.getElementById('myDiv').style.filter="mask(color=#ffffff)"
17
}
18
function noFilter()
19
{
20
document.getElementById('myDiv').style.filter=false
21
}
22
</script>
23
</head>
24
​
25
<body>
26
<p>本例演示如何动态地插入遮罩滤镜。</p>
27
<p>请把鼠标移动到图像上：</p>
28
<div><img src="/img/eg_landscape.jpg" /></div>
29
<div onmouseover="getFilter()" onmouseout="noFilter()" id="myDiv">
30
<h1>Mouse over this image landscape</h1></div>
31
</body>
32
</html>
33
​