模仿新浪tab栏切换，用最少的jq和css让两个tab栏各自切换，怎么写

html-css010

模仿新浪tab栏切换，用最少的jq和css让两个tab栏各自切换，怎么写,第1张

<ul><li>list1</li><li>list2</li><li>list3</li><li>list4</li></ul>

<div>1</div><div>2</div><div>3</div><div>4</div>

<script>

$(function(){

$("ul li").mouseover(function(){

var index=$(this).index()

$("div").eq(index).show().siblings().hide()

})

})

</script>

看看http://www.yahoo.com/首页就知道了啊。

页面正中的栏目，Featured 、Entertainment、Sports、Video几个就是Tab，点击后可以在不刷新页面的情况下，在有限的空间显示不同页面的内容。

其实平时我们用的IE7、遨游、firefox等浏览器也可以用不同Tab打开不同的页面，然后自由切换浏览不同的页面。

不知明白了没有？

<script type="text/javascript">

function tabSwitch2(_this,content_prefix,active) { 

var tabs = document.getElementsByName(_this.name) 

var number = tabs.length 

for (var i=0 i < number i++) { 

var tab = tabs[i] 

tab.className = ""

tab.parentNode.className = ''

document.getElementById(content_prefix+i).style.display = 'none' 

} 

_this.className = "easytab_active" 

document.getElementById(content_prefix+active).style.display = 'block'

tabs[active].style.className = 'easytab_active'

tabs[active].parentNode.className = 'li1'

} 

</script>

替换一下