这个页面如何做啊若是提供些代码最好了，非常感谢
日期：2014-05-17 浏览次数：20739 次
这个页面怎么做啊，若是提供些代码最好了，非常感谢
图片插入不显示，5555
打开这个页面可以看图片http://img.my.csdn.net/uploads/201205/24/1337851311_6863.jpg
我自己用tab怎么用也弄不出效果来，希望点击的时候切换，鼠标滑过不切换的~
谢谢啦
------解决方案--------------------
参考下 jquery的
图片插入不显示，5555
打开这个页面可以看图片http://img.my.csdn.net/uploads/201205/24/1337851311_6863.jpg
我自己用tab怎么用也弄不出效果来，希望点击的时候切换，鼠标滑过不切换的~
谢谢啦
------解决方案--------------------
参考下 jquery的
- HTML code
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html;charset=gb2312" />
<link rel="stylesheet" href="http://yui.yahooapis.com/2.9.0/build/reset/reset-min.css" />
<script src="http://code.jquery.com/jquery-latest.js"></script>
<style type="text/css"><!--
.wrapper {
margin:80px auto;
width:400px; height:300px;
border:1px solid #aaa;
}
.head {
height:30px;
background:#ddd;
border-bottom:1px solid #aaa;
line-height:30px; text-align:center;
font-size:14px; font-weight:bold;
}
.head li {
float:left;
width:100px;
}
.head li.cur {
position:relative;
top:0; _top:1px; left:1px;
background:#fff;
border:1px solid #aaa;
border-bottom:none;
overflow:hidden;
}
.head li a {
display:block;
width:100px;
}
.con {
clear:both;
padding:10px;
}
.con li {
display:none;
}
.con .db { display:block; }
a {
outline:none;
}
--></style>
</head>
<body>
<div class="wrapper">
<ul class="head">
<li class="cur"><a href="#" hidefocus="hidefocus">Asp.net</a></li>
<li><a href="#" hidefocus="hidefocus">PHP</a></li>
<li><a href="#" hidefocus="hidefocus">mySql</a></li>
</ul>
<ul class="con">
<li class="db">1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
<script>
$('.head li').click(function(){
$(this).addClass('cur').siblings().removeClass('cur');
$('.con li:eq('+$(this).index()+')').show().siblings().hide();
return false
})
</script>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
