js+css导航条问题

tianyangxiaoxiao 2008-09-25 11:29:08
如题
...全文
50 2 打赏 收藏 转发到动态 举报
写回复
用AI写文章
2 条回复
切换为时间正序
请发表友善的回复…
发表回复
yjgyjg4 2008-09-25
  • 打赏
  • 举报
回复
不知道想要什么样的效果,这里给你一个带下拉的看样式
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>sample</title>
<SCRIPT LANGUAGE="JavaScript">
<!--
function onclickChange(obj,index){
document.getElementById(obj).style.fontWeight='bold';
document.getElementById(obj).style.color='#D07B02';
for(i=1; i<=6; i++){
if(i != index){
document.getElementById('tar'+i).style.fontWeight='';
document.getElementById('tar'+i).style.color='#000000';
}
}
}
//-->
</SCRIPT>
<style type="text/css">
* {
margin:0;
padding:0;
list-style:none;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
margin:2px;
}

a:link {
color: #000000;
text-decoration: none
}

a:visited {
color: #000000;
text-decoration: none
}

a:hover {
color: #000000;
text-decoration: underline;
}

#basic-accordian{
border:1px solid #a5a576; 边框颜色
padding:5px;
width:170px;
position:absolute;
left:50%;
top:50%;
margin-left:-175px;
z-index:2;
margin-top:-100px;
}

.accordion_headings{
padding:5px;
background:#ffe89c;
color:#010102;
border:1px solid #a5a576;
cursor:pointer;
font-weight:bold;
}

.accordion_headings:hover{
background:#feb24b;
}

.accordion_child{
padding:8px;
background:#ffffe7;
}

.header_highlight{
background:#feb24b;
}

</style>
<script type="text/javascript" src="accordian.pack.js"></script>
</head>
<body onload="new Accordian('basic-accordian',5,'header_highlight');" topmargin="0">
<div id="basic-accordian" style="left: 180px; top: 104px" >
<!--Parent of the Accordion-->
<!--Start of each accordion item-->
<div id="test-header" class="accordion_headings header_highlight" >Home</div><!--Heading of the accordion ( clicked to show n hide ) -->

<!--Prefix of heading (the DIV above this) and content (the DIV below this) to be same... eg. foo-header & foo-content-->

<div id="test-content"><!--DIV which show/hide on click of header-->

<!--This DIV is for inline styling like padding...-->
<div class="accordion_child">

<a href="#" onclick="onclickChange('tar1',1)"><font id="tar1">Content1</font></a>
<br><br>
<a href="#" onclick="onclickChange('tar2',2)"><font id="tar2">Content2</font></a>
</div>
</div>
<!--End of each accordion item-->
<!--Start of each accordion item-->
<div id="test1-header" class="accordion_headings" >About Us</div><!--Heading of the accordion ( clicked to show n hide ) -->

<!--Prefix of heading (the DIV above this) and content (the DIV below this) to be same... eg. foo-header & foo-content-->

<div id="test1-content"><!--DIV which show/hide on click of header-->

<!--This DIV is for inline styling like padding...-->
<div class="accordion_child">
<a href="#" onclick="onclickChange('tar3',3)"><font id="tar3">Content1</font></a>
<br><br>
<a href="#" onclick="onclickChange('tar4',4)"><font id="tar4">Content2</font></a>
</div>

</div>
<!--End of each accordion item-->
<!--Start of each accordion item-->
<div id="test2-header" class="accordion_headings" >Downloads</div><!--Heading of the accordion ( clicked to show n hide ) -->
<!--Prefix of heading (the DIV above this) and content (the DIV below this) to be same... eg. foo-header & foo-content-->
<div id="test2-content"><!--DIV which show/hide on click of header-->
<!--This DIV is for inline styling like padding...-->
<div class="accordion_child">
<a href="#" onclick="onclickChange('tar5',5)"><font id="tar5">Content1</font></a>
<br><br>
<a href="#" onclick="onclickChange('tar6',6)"><font id="tar6">Content2</font></a>
</div>
</div>
<!--End of each accordion item-->
</div><!--End of accordion parent-->
</body>
</html>

//**************************************
//by dezinerfolio.com
eval((function(){a=" {3document5ByIdOgvv=8E!&&E!K32}o=E;E;v=parseInt(2E=o;3vdheight=vHpx}Oofvgvv=v/d.h;dDv;dfilterKalpha(D+v*100H)Obz>0z#-1:z-v90E;%eE;z<x(x-z)#+1:v+z9x%Accordians,fl=5sByTagName(diva=[]d=S;QQ,Q)=={a.push}}xL((hc=h0,hc6==hcMc+;c;coverflowKhidden;c.h=g(cc.s=(s=8)?7:s;h.f=f;h.c=a;h.match4fHH))x=h}hC=(Rj=0;j<F.c;j++n=F.c[j];n=n0,ndMn6nMn+;s=dJt4sH)Rp=0;p<s;p++s[p]=KGsJce(p,1d=s.join( break}}clearn.tQ==FPg(n,0@ed+K GP@b}}}}})(S)}x!LxC()}}",b=49;while(b>=0)a=a.replace(new RegExp("#%2345689@CDEFGHJKLMOPQRS".charAt(b),"g"),("\\\042\044.style.displayfunctionInterval(.className.length.indexOf(-)(d)if(-content).id){.style.=none{d=;z=g;x=d.h;(d,;for(i=0;i<l;i++);}else{('+n+')',9)}.substr(=blockv=Math.round(/d.sv=(v<1)?zcleard.t)}} d.offsetHeightreturn (new RegExp(.getElement+-header=undefined;ofv)gn.t=set'.onclickopacity=dthis+d.f+.spli==null=(} n=dfor(l[i]".split(""))[b--]);return a})())
胡须棉花糖 2008-09-25
  • 打赏
  • 举报
回复
友情顶

81,092

社区成员

发帖
与我相关
我的任务
社区描述
Java Web 开发
社区管理员
  • Web 开发社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧