zoukankan html css js c++ java

TAB切换效果

<title>TAB切换效果</title>
<script type="text/javascript">
function change(ss){
    if(ss=="top1"){
        document.getElementById("left1").style.display="block";
        document.getElementById("left2").style.display="none";
        document.getElementById("right1").style.display="block";
        document.getElementById("right2").style.display="none";
        document.getElementById("end1").style.display="block";
        document.getElementById("end2").style.display="none";
        }
else{
        document.getElementById("left1").style.display="none";
        document.getElementById("left2").style.display="block";
        document.getElementById("right1").style.display="none";
        document.getElementById("right2").style.display="block";
        document.getElementById("end1").style.display="none";
        document.getElementById("end2").style.display="block";    
    }
}
</script>
<style type="text/css">
img{border:0;}
</style>
</head>

<body>
<table border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td><img src="images/left1.jpg" alt="笔记本" id="left1"/><img src="images/left2.jpg" alt="笔记本" id="left2" onmouseover="change('top1')" style="display:none;"/></td>
     <td><img src="images/right1.jpg" alt="手机充值" id="right1" onmouseover="change('top2')"/><img src="images/right2.jpg" alt="手机充值" id="right2" style="display:none;" /></td>
  </tr>
  <tr>
    <td colspan="2"><img src="images/end1.jpg" alt="笔记本" id="end1" /><img src="images/end2.jpg" alt="手机充值" id="end2" style="display:none;"/></td>
  </tr>
</table>

</body>

查看全文

相关阅读:
HTML5 <meta> 标签属性，所有meta用法
 C#中导出数据到Excel表格中逗号
 .net MVC 中缓存的使用逗号
 MVC 过滤器逗号
 .Net 分布式技术比较逗号
 将DataTable导出为Excel (XML Spreadsheet).
AntiTD
三星WP7手机MANGO一分钟完美越狱
 SPGridView 研究笔记 Part 3 分组
 Silverlight 4 Binding Cheatsheet [转]

原文地址：https://www.cnblogs.com/914556495wxkj/p/3426682.html