鼠标指针移入移出改变图片透明度

 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta charset="utf-8">
 5 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 6 <title>Examples</title>
 7 <meta name="description" content="">
 8 <meta name="keywords" content="">
 9 <link href="" rel="stylesheet">
10 <style type="text/css">
11   
12 #qwer{
13      900px;
14     margin: 0 auto;
15     margin-top: 250px;
16 }
17 #qwer li{
18     float:left;
19     150px;
20     height:150px;
21     border:1px solid black;
22 }
23 li img{
24     float:left;
25     opacity:0.2;
26     cursor: pointer;
27      140px;
28     height: 140px;
29     margin: 5px 5px 5px 5px;
30 }
31 li.current img{
32     opacity:1;
33 }
34 
35 </style>
36 </head>
37 <body>
38 <ul id="qwer">
39     <li><img src="1.JPG"/></li>
40     <li><img src="1.JPG"/></li>
41     <li><img src="1.JPG"/></li>
42     <li><img src="1.JPG"/></li>
43     <li><img src="1.JPG"/></li>
44 </ul>
45 <script type="text/javascript">
46 window.onload=function(){
47     var qwe=document.getElementsByTagName("li");
48     for (var i=0;i<qwe.length;i++){
49         qwe[i].onmouseover=function(){
50             this.className="current";
51         }
52         qwe[i].onmouseout=function(){
53             this.className="";
54         }
55     }
56 
57 }
58 </script>
59 </body>
60 </html>