?如何做成这样的网页? - Web 开发 / 其他
?如何做成这样的网页?
就是鼠标放在标题上就可以翻页的(不是Flash)
例如:
http://www.xunlei.com/第二个横广告条上面的精华资源那个效果
谢谢!
[解决办法]
<span onmouseover= "showdiv1() " style= "cursor:hand " > 显示层1 </span>
<span onmouseover= "showdiv2() " style= "cursor:hand " > 显示层2 </span>
<div style= "display:block " id= "div1 ">
<table cellpadding= "5 " cellspacing= "0 " border=1 bordercolor= "fff000 ">
<tr>
<td>
这是层1
</td>
</tr>
</table>
</div>
<div style= "display:none " id= "div2 " border=1>
<table cellpadding= "5 " cellspacing= "0 " border=1 bordercolor= "000fff ">
<tr>
<td >
这是层2
</td>
</tr>
</table>
</div>
<script language= "javascript ">
function showdiv1() {
Div1 = document.getElementById( "div1 ");
Div2 = document.getElementById( "div2 ");
Div1.style.display = "block ";
Div2.style.display = "none ";
}
function showdiv2() {
Div1 = document.getElementById( "div1 ");
Div2 = document.getElementById( "div2 ");
Div2.style.display = "block ";
Div1.style.display = "none ";
}
</script>
如果使用图片或其它的页面元素作为切换标签，也一样，加上需要的onmouseover onmouseout onmousedown事件就可以，如：
<img src= "xxx1.gif " onmouseover= "this.src=＇xxx1.gif＇;showdiv1() " onmouseout= "this.src=＇xxx2.gif＇ " border= "0 " style= "cursor:hand " >
