html 滑动门效果,怎样用DW做滑动门的效果

滑动门永远是新手的目标！而且单纯的DW是做不出这种效果的，必须要有javascript的！

html,body{margin:0;text-align:center;over-flow:hidden;height:100%;width:100%;}

UL{list-style-type:none; margin:0px;}

.ctt{height:auto;clear:both;border:1px solid #064ca1;border-top:0;text-align:left;}

.w936{margin:2px 0;clear:both;width:936px;/*整个滑动门的宽度*/}

/*TAB切换效果*/

.tb_{滑动门背景}

.tb_ ul{height:24px;}

.tb_ li{float:left; margin-right:2px;height: 24px;line-height:1.9;width: 94px;cursor:pointer;}

/*用于控制显示与隐藏的css类*/

.normaltab{选中的滑动门标签背景}

.hovertab{未选中的滑动门标签背景}

.dis{display:block;}

.undis{display:none;}

-->

//

function g(o){return document.getElementById(o);}

function HoverLi(n){

//如果有N个标签，就将i<=N;

for(var i=1;i<=3;i++){g('tb_'+i).className='normaltab';g('tbc_0'+i).className='undis';}g('tbc_0'+n).className='dis';g('tb_'+n).className='hovertab';

}

//如果要做成点击后再转到请将

中的onmouseover改成onclick;

//]]>

• 标题1

• 标题2

• 标题3

内容1

内容2

内容3