因此,我正在为一个客户端开发一个页面,该客户端上有一个手风琴(纯css)。
它工作得很好,但是当我将它添加到magento (我以前从未使用过的CMS中)时,一切都可以工作,但是当您单击该链接打开手风琴时,它会跳到页面的顶部。
下面是html:
<div id="accordion">
<ul>
<li ><a href="#one">CHICKEN MARINADES</a>
<div id="one" class="accordion">
jdv[oifdj
</div>
</li>
<li>
<a href="#two">PORK MARINADES</a>
<div id="two" class="accordion">
dpifhd[foivh
</div>
</li>
<li>
<a href="#three">BEEF MARINADES</a>
<div id="three" class="accordion">
gfspiuqdhsv;
</div>
</li>
</ul>
</div>下面是css:
#accordion{margin:10px auto; max-width:600px;}
#accordion ul{list-style:none;margin:0;padding:0;}
.accordion{display:none;}
.accordion:target{display:block;}
#accordion ul li a{text-decoration:none;display:block;padding:2px;}
.accordion{padding:4px;}
/* Colors
====================*/
#accordion ul{
/*box-shadow*/
-webkit-box-shadow:0 4px 10px #BDBDBD;
-moz-box-shadow:0 4px 10px #BDBDBD;
box-shadow:0 4px 10px #BDBDBD;
/*border-radius*/
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
#accordion ul li a{
background:#fff;
color:#999;
}
.accordion{
background:#fdfdfd;
color:#999;
}有谁知道如何阻止这种现象发生在洋红上吗?
*编辑*忘记提到,没有JS (目前--但我愿意接受!)
发布于 2015-07-22 12:41:55
问题在于这句话:
.accordion:target{display:block;}即使当我试图使用JS来阻止页面跳转时,它也会把其他事情搞砸。
我已经实现了一个全新的手风琴,它使用JS并对其进行排序!
https://stackoverflow.com/questions/31542485
复制相似问题