Question

这是我的第一篇文章，如果格式不正确，我深表歉意，但是手风琴我需要一些帮助。我创建了以下手风琴。我如何才能确保一个手风琴物品始终保持打开状态？目前，当我单击一个项目两次时，它正在崩溃，但是我希望它保持打开状态。其他一切都很好。

<script>
var accordion = (function(){
  
  var $accordion = $('.js-accordion');
  var $accordion_header = $accordion.find('.js-accordion-header');
  var $accordion_item = $('.js-accordion-item');
 
  // default settings 
  var settings = {
    // animation speed
    speed: 400,
    
    // close all other accordion items if true
    oneOpen: false
  };
    
  return {
    // pass configurable object literal
    init: function($settings) {
      $accordion_header.on('click', function() {
        accordion.toggle($(this)); 
      });
      
      $.extend(settings, $settings); 
      
      // ensure only one accordion is active if oneOpen is true
      if(settings.oneOpen && $('.js-accordion-item.active').length > 1) {
        $('.js-accordion-item.active:not(:first)').removeClass('active');
      }
      
      // reveal the active accordion bodies
      $('.js-accordion-item.active').find('> .js-accordion-body').show();
    },
    toggle: function($this) {
            
      if(settings.oneOpen && $this[0] != $this.closest('.js-accordion').find('> .js-accordion-item.active > .js-accordion-header')[0]) {
        $this.closest('.js-accordion')
               .find('> .js-accordion-item') 
               .removeClass('active')
               .find('.js-accordion-body')
               .slideUp()
      }
      
      // show/hide the clicked accordion item
      $this.closest('.js-accordion-item').toggleClass('active');
      $this.next().stop().slideToggle(settings.speed);
    }
  }
})();
$(document).ready(function(){
  accordion.init({ speed: 400, oneOpen: true });
});
</script>

<div data-ix="fade-up-1" id="w-node-8cd3c29f7e05-c133123e" class="accordion js-accordion">
          <div class="accordion__item js-accordion-item active">
            <div class="accordion-header js-accordion-header">
              <h5 class="question-text">Abstract management</h5>
            </div>
            <div data-ix="hide-on-load" class="accordion-body js-accordion-body">
              <div class="accordion-body__contents">Streamline your abstract management process from start to finish with a flexible call for abstracts. Create the best structure for your conference program. Use Morressier to collaborate with your team, ensuring that work overload doesn’t land with you.</div>
            </div>
          </div>
          <div class="accordion__item js-accordion-item">
            <div class="accordion-header js-accordion-header">
              <h5 class="question-text">Poster and presentation management<br></h5>
            </div>
            <div data-ix="hide-on-load" class="accordion-body js-accordion-body">
              <div class="accordion-body__contents">Get a complete overview of all your conference content on your dashboard. From here, invite researchers to upload posters and presentations, then send out automatic reminders as the big day nears.</div>
            </div>
          </div>
          <div class="accordion__item js-accordion-item">
            <div class="accordion-header js-accordion-header">
              <h5 class="question-text">On-site poster and presentation app<br></h5>
            </div>
            <div data-ix="hide-on-load" class="accordion-body js-accordion-body">
              <div class="accordion-body__contents">Authors can showcase their research beautifully and with ease using our on-site app (compatible with iPad and on any screen). Guarantee impactful, hassle-free presentation sessions. Encourage delegates to network with other attendees and bookmark, navigate, and explore all ePosters.</div>
            </div>
          </div>
          <div class="accordion__item js-accordion-item">
            <div class="accordion-header js-accordion-header">
              <h5 class="question-text">Quantifiable insights and analytics<br></h5>
            </div>
            <div data-ix="hide-on-load" class="accordion-body js-accordion-body">
              <div class="accordion-body__contents">Find out which posters were shared or viewed the most, and for how long. Learn about popular keywords and identify the day&#x27;s trending topic. Use these statistics to select a poster prize winner.</div>
            </div>
          </div>
          <div class="accordion__item js-accordion-item">
            <div class="accordion-header js-accordion-header">
              <h5 class="question-text">Online conference content repository<br></h5>
            </div>
            <div data-ix="hide-on-load" class="accordion-body js-accordion-body">
              <div class="accordion-body__contents">Store your institution&#x27;s abstracts, posters, and presentations on a dedicated page and enjoy full access to conference content before, during, and after the event. Later, share the page with attendees to increase awareness and reach new audiences.</div>
            </div>
          </div>
        </div>

如何确保一个手风琴面板始终打开？

0 个答案: