我有一个第三方开发人员为我们的自定义网站构建了一个手风琴。
我对此有疑问。
当使用移动尺寸版本时-手风琴下拉菜单会打开,但立即关闭。第二次单击后,它应能正常工作。
这发生在所有菜单部分。
我对jQuery,CSS或后端不是很好。但是,我可以轻松地进行更新或更改。谁能帮我解决这个问题。
非常感谢
CSS:
button.accordion {
cursor: pointer;
background: transparent;
color: $colorForeground;
padding: ($gutter / 3);
font-size: 1.1em;
width: 100%;
font-weight: 500;
text-align: left;
border: 0;
outline: none;
transition: 0.4s;
margin: 0;
position: relative;
}
button.accordion.active,
button.accordion:hover {
background-color: transparent;
}
button.accordion:after {
position: absolute;
right: 0;
top: 050%;
margin-top: -7px;
-ms-transition: 0.3s ease transform;
-webkit-transition: 0.3s ease transform;
transition: 0.3s ease transform;
}
button.accordion:after {
content: url({{ 'plus.svg' | asset_url }});
}
button.accordion.active:after {
-ms-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
}
div.panel {
padding: 0 18px;
background-color: $colorHighlight;
max-height: 0;
overflow: hidden;
-webkit-transition: 0.6s ease-in-out;
-moz-transition: 0.6s ease-in-out;
transition: 0.6s ease-in-out;
opacity: 0;
margin: 0;
.col {
padding: $gutter/4 $gutter/2 0 0;
}
}
div.panel.show {
opacity: 1;
max-height: 5000px;
}
HTML: