dede 的侧边栏 改成点击展开的效果,怎么办? 20C

用dede做了一个网站,但是产品展示的侧边导航很不满意,自己在网上找了代码片段改了之后还是达不到想要的效果,现在的效果如图:
图片说明

鼠标移动向右展开的,我想改成鼠标点击向下展开,点击下一个收起之前展开的,展开正在点击的。麻烦了,谢谢!

html代码:

<div class="tit">栏目导航</div>
<div class="cates">
<div class="menu">
<ul> 
{dede:channel type='top' }
<li><a class="hide" href="[field:typelink/]">[field:typename/]</a>
<ul>[field:sonchannel0]<li><a href="[field:typelink/]">[field:typename/]</a>
<ul class="right_side">[field:sonchannel1]
<li><a href="[field:typelink/]">[field:typename/]</a></li>
[/field:sonchannel1]
</ul></li>
[/field:sonchannel0]</ul>
{/dede:channel}
</ul>
</div>
</div>
</div>

CSS部分

<style>
.menu {width:76px;height:150px; position:relative; font-size:16px;}
.menu ul li a, .menu ul li a:visited {display:block; text-decoration:none; color:#000;width:74px; height:25px; text-align:center; color:#000;line-height:20px; font-size:15px; overflow:hidden;}
.menu ul {padding:0; margin:0;list-style-type: none; }
.menu ul li {float:left; margin-right:1px; position:relative;}
.menu ul li ul {display: none;}
/* specific to non IE browsers */
.menu ul li:hover a {color:#000; background:#FEBFD1;}
.menu ul li:hover ul {display:block; position:absolute; top:0; left:75px; width:75px;}
.menu ul li:hover ul li a.hide {background:#FEBFD1; color:#000;}
.menu ul li:hover ul li:hover a.hide {background:#F66E95; color:#fff;}
.menu ul li:hover ul li ul {display: none;}
.menu ul li:hover ul li a {display:block; background:#FEBFD1; color:#000;}
.menu ul li:hover ul li a:hover {background:#F66E95; color:#fff;}
.menu ul li:hover ul li:hover ul {display:block; position:absolute; left:75px; top:0;}

2个回答

wjxah
若许 你给的是html静态的,我需要解决的是 dede 织梦模板的
7 个月之前 回复
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!