如何用DIV+CSS来构建内嵌页面跟随按钮变化-青岛设计网论坛


论坛首页 WEB网页设计教程如何用DIV+CSS来构建内嵌页面跟随按钮变化

[公告]快到[搜艺招聘网]发布招聘信息注册简历、发布自己作品！：）

如何用DIV+CSS来构建内嵌页面跟随按钮变化 reply disable

zhanzhan

查看zhanzhan的博客

金钱	: 792
Level	: 0
发帖数	: 158
最后登陆	: 2008/12/12
注册时间	: 2007/3/15

信息 | 留言

如何用DIV+CSS来构建内嵌页面跟随按钮变化

效果说明图:

CSS代码:

.PartL {
BACKGROUND: url() #ffd77b repeat-y; OVERFLOW: hidden;
}
.TabADS {
OVERFLOW: hidden; WIDTH: 800px;
}
.TabADS UL {
CLEAR: both; OVERFLOW: hidden; WIDTH: 800px; HEIGHT: 24px;
}
.TabADS LI {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: url(images/center1.jpg) #e4e4e4 no-repeat right 50%; FLOAT: left; PADDING-BOTTOM: 0px; WIDTH: 60px; CURSOR: pointer; COLOR: #333; PADDING-TOP: 6px; HEIGHT: 18px; TEXT-ALIGN: center
}
.TabADS .TasADSOn {
FONT-WEIGHT: bold; BACKGROUND: url(images/center.jpg) #ffe4a6 no-repeat right 50%; CURSOR: pointer; COLOR: #333; TEXT-ALIGN: center
}
.TabADSCon {
PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px
}
.TabADSCon LI {
LINE-HEIGHT: 20px; TEXT-ALIGN: left;OVERFLOW: hidden;
}

HTML代码:

<TABLE width=800 align="center" cellSpacing=0>
<TBODY>
<TR>
<TD>
<SCRIPT language=javascript type=text/javascript>
function Show_TabADSMenu(tabadid_num,tabadnum){
for(var i=0;i<5;i++){document.getElementById("tabadcontent_"+tabadid_num+i).style.display="none";}
for(var i=0;i<5;i++){document.getElementById("tabadmenu_"+tabadid_num+i).className="";}
document.getElementById("tabadmenu_"+tabadid_num+tabadnum).className="TasADSOn";
document.getElementById("tabadcontent_"+tabadid_num+tabadnum).style.display="block";
}
</SCRIPT>
<DIV class=TabADS>
<UL>
<LI class=TasADSOn id=tabadmenu_10
onmouseover="setTimeout('Show_TabADSMenu(1,0)',200);">功能一 </LI>
<LI id=tabadmenu_11
onmouseover="setTimeout('Show_TabADSMenu(1,1)',200);">功能二 </LI>
<LI id=tabadmenu_12
onmouseover="setTimeout('Show_TabADSMenu(1,2)',200);">功能三</LI>
<LI id=tabadmenu_13
onmouseover="setTimeout('Show_TabADSMenu(1,3)',200);">功能四 </LI>
<LI id=tabadmenu_14
onmouseover="setTimeout('Show_TabADSMenu(1,4)',200);">功能五 </LI>
</UL>
</DIV>
<DIV class=TabADSCon>
<UL id=tabadcontent_10>
<LI>
<iframe src="1.html" width="800" height="400" style="frameborder:0" frameborder=auto scrolling=auto></iframe>
</LI>
</UL>
<UL id=tabadcontent_11 style="DISPLAY: none">
<LI>
<iframe src="5.html" width="800" height="400" style="frameborder:0" frameborder=auto scrolling=auto></iframe>
</LI>
</UL>
<UL id=tabadcontent_12 style="DISPLAY: none">
<LI>
<iframe src="2.html" width="800" height="400" style="frameborder:0" frameborder=auto scrolling=auto></iframe>
</LI>
</UL>
<UL id=tabadcontent_13 style="DISPLAY: none">
<LI>
<iframe src="3.html" width="800" height="400" style="frameborder:0" frameborder=auto scrolling=auto></iframe>
</LI>
</UL>
<UL id=tabadcontent_14 style="DISPLAY: none">
<LI>
<iframe src="1.html" width="800" height="400" style="frameborder:0" frameborder=auto scrolling=auto></iframe>
</LI>
</UL>
</div>
</div>
</TD>
</TR>
</TBODY>
</TABLE>

①岁半の站站

2007/4/29

信息 | 留言 | 引用 | 回复 | 编辑 | 置顶 | 移动 | 删除

回复:re:如何用DIV+CSS来构建内嵌页面跟随按钮变化

Lisa·粉

查看Lisa·粉的博客

金钱	: 2201
Level	: 0
发帖数	: 579
最后登陆	: 2007/8/11
注册时间	: 2007/3/15

信息 | 留言引用 | 回复

看不懂啊~

~~~~~ Lisa·粉的博客~~~~~涂鸦留言本~~~~~ 青岛搜艺招聘网~~~~~

2007/5/2

编辑 | 删除

7 [ 1 ] 8