页面布局,写ul
,嵌套li
li里面再放图片。留好各种边框线border
script部分:
比起建立一个函数去直接修改图片的透明度opacity
属性,这里给img
预设了一个特殊的类,在鼠标移入/移出时调用/去掉类,更简便,也方便日后修改这个效果。current类:li img.current {opacity:1}
<script>
window.onload = function(){
var oimg = document.getElementsByTagName("img");
for(var i = 0;i<oimg.length;i++){
oimg[i].onmouseover = function(){
this.className="current";} //用this
oimg[i].onmouseout = function(){
this.className="";}
}
};
</script>