Accordian Dropdown无法在手机/平板电脑上运行

Question

我的常见问题解答在我的网站上有一个手风琴下拉菜单。在移动设备上，当敲击杆时，手风琴下降然后快速消失。我希望答案部分可以下拉（可能是顺利过渡）并保持到＃34;问题＆＃34;再次单击栏，或单击另一个问题栏。我使用以下代码：

JS

    <script> 
$(document).ready(function(){

  $(document).on('touchstart mousedown', '.acc-btn', function(){
    // If you only want one visible at a time:
    $('.acc-container').find('.selected').not(this).removeClass('selected');

    // ^^ 'closes' everything by removing the class selected.
    // Except the one we just clicked, otherwise it wouldn't toggle—
    // the class would get removed and added back two lines down.


    $(this).toggleClass('selected');

  });

});</script>

HTML

<div class="acc-container">

<div class="acc-btn"><h1>What is Company?</h1></div>

<div class="acc-content">

<div class="acc-content-inner">

<p> Answer blah blah</p>

</div>

</div>

CSS

.acc-container {
  width:90%;
  margin:30px auto 0 auto;
  overflow:hidden;
}

.acc-btn { 
 font-family: "Oswald", sans-serif;
font-weight:lighter;
text-transform: uppercase;
padding: 5px 5px 5px 5px;
margin-bottom:3px;
height: 100%;
cursor: pointer;

}


.acc-content {
  max-height:0px;
  width:100%;
  margin:0 auto;
  overflow:hidden;
  background:#C9C8C8;
  color:#000000;
  /*-webkit-transition: all 0.35s ease-in-out 0s;
  -moz-transition: all 0.35s ease-in-out 0s;
  transition: all 0.35s ease-in-out 0s;*/
}

.selected + .acc-content {
    max-height: 700px;
}

.acc-content-inner {
  padding:30px;
}

.open {
  height: auto;
}