<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>导航</title>
<style type="text/css">
/*.header1{
float: left;
}*/
html{
overflow:hidden;
}
#header2,#header3,#header4{
display: none;
}
iframe{
overflow-y: hidden;
height: 850px;
}
.hidden{
display: none;
}
</style>
<link rel="stylesheet" type="text/css" href="css/Common style.css"/>
</head>
<body>
<div class="banner">
<img class="red" src="img/top.png"/>
<img class="image" src="img/2.png"/>
<div class="left_text" id="left_text">
<a class="a" href="javascript:void(0);"><input type="button" value="1" class="list"></a>
<a class="a" href="javascript:void(0);"><input type="button" value="2" class="list"></a>
<a class="a" href="javascript:void(0);"><input type="button" value="3" class="list"></a>
<a class="a" href="javascript:void(0);"><input type="button" value="4" class="list"></a>
</div>
</div>
<iframe src="1.html" width="1000px" height="850px" frameborder="0px"></iframe>
<iframe class="hidden" src="2.html" width="1000px" height="850px" iframeborder="no" frameborder="0px"></iframe>
<iframe class="hidden" src="3.html" width="1000px" height="850px" iframeborder="no" frameborder="0px"></iframe>
<iframe class="hidden" src="4.html" width="1000px" height="850px" iframeborder="no" frameborder="0px"></iframe>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
window.onload=function(){
var projectCho=document.getElementById("left_text");
var btn=projectCho.getElementsByTagName('input');
var ifm=document.getElementsByTagName("iframe");
for(var i=0;i<btn.length;i++){
btn[i].index=i;
btn[i].onclick=function(){
for(var j=0;j<btn.length;j++){
btn[j].className="list";
ifm[j].style.display="none";
}
ifm[this.index].style.display="block";
this.className="list1";
};
}
};
</script>
</body>
</html>
杜超