怎样在dreamweaver做出这种效果

来源:百度知道 编辑:UC知道 时间:2024/05/10 08:14:11
http://game.xunlei.com/xs00695.htm
像最后的“游戏资讯”板块,当鼠标移动到按钮上就会改变内容,这种效果怎么做出来的。
呵呵,说出这是利用什么效果做出来的也可以

这是用JS代码做出来的。很多网站都用这种效果,包括我自己的网站上面也用了很多。网上称这种技术为“滑门技术”
以下是一个简单的例子:
<style type="text/css">
td{font-size:13px;}
a{text-decoration:none;color:#333;}
.menu_title{background:#ccc;}
.menu_title_on{background:#eee;}
.menu_title_on a{color:red;}
</style>

<SCRIPT language=JavaScript>
var tID=0;
function ShowTabs(ID){
if(ID!=tID){
TabTitle[tID].className='menu_title';
TabTitle[ID].className='menu_title_on';
Tabs[tID].style.display='none';
Tabs[ID].style.display='';
tID=ID;
}
}
</SCRIPT>

<table width="100%" border="1">
<tr align="center">
<td class='menu_title_on' id='TabTitle' onmouseover='ShowTabs(0)'><a href="#">软件简介</a></td>
<td class='menu_title' id='TabTitle'