选项卡

最新推荐文章于 2024-06-18 07:15:00 发布

fei157538651

最新推荐文章于 2024-06-18 07:15:00 发布

阅读量87

点赞数

分类专栏：学习笔记文章标签： javascript ViewUI

本文链接：https://blog.csdn.net/fei157538651/article/details/84318439

版权

学习笔记专栏收录该内容

9 篇文章 0 订阅

订阅专栏

图片要自己添加

<html>

<head>

<title></title>
<style type="text/css">

a{
text-decoration : none ;
background:url(MenuBg.gif) ;
width : 99px ;
height : 29px ;
padding-top : 8px ;
padding-left : 10px ;
border : 0px ;
lihe-height:3px;

}
a:hover{text-decoration : none ;
background:url(MenuBg.gif) ;
width : 99px ;
height : 29px ;
padding-top : 8px ;
padding-left : 10px ;
border : 0px ;
lihe-height:3px;}
.width{ width : 800px ;}
</style>

<script type="text/javascript">
function show(id){
var arr=document.getElementsByTagName("img");
for(var i=0;i<arr.length;i++){
    if(i==(id-1)){
        arr[i].style.display='block';
    }
    else{
         arr[i].style.display='none';
    }
    
}
}
</script>
</head>

<body>
<center>
<table class="width">
<tr>
    <td><a href="#" οnmοuseοver="show(1)">qq专区</a></td> 
     <td><a href="#" οnmοuseοver="show(2)">时尚饰品</a></td>
       <td><a href="#" οnmοuseοver="show(3)">1元专区</a></td>
         <td><a href="#" οnmοuseοver="show(4)">彩妆</a></td>
</tr>
<tr>
    <td colspan="4">
    <img src="pic1.jpg" width="750px" height="574px"/>
    <img src="pic2.jpg" width="750px" height="574px" style="display:none"/>
     <img src="pic3.jpg" width="750px" height="574px"  style="display:none"/>
      <img src="pic4.jpg" width="750px" height="574px" style="display:none"/>
    </td>
</tr>
</table>
</center>
</body>

</html>

fei157538651

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
选项卡

图片要自己添加&lt;html&gt;&lt;head&gt;&lt;title&gt;&lt;/title&gt;&lt;style type="text/css"&gt;a{text-decoration : none ;background:url(MenuBg.gif) ;width : 99px ;height : 29px ;padd...
复制链接

扫一扫