jQuery和Foundation 4手風琴深層鏈接

Question

我使用的是Foundation 4手風琴，其深層鏈接設置為true：

<div class="section-container accordion" data-section="accordion" data-options="deep_linking: true">
      <section class="section">
        <h3 class="title"> <a href="#panel1">Program Highlights <span class="arrow_down"></span></a></h3>
        <div class="content" data-slug="panel1">...

盡管Foundation的文檔說這應該可行，但它本身沒有任何作用...所以我補充道：

$(document).foundation('section', {
    callback: function (){
    var containerPos = $('.active').offset().top;
   $('html, body').animate({ scrollTop: containerPos }, 200);
    }
  });

這可行，但是我希望在再次單擊時關閉手風琴面板，而不必單擊另一個面板。 因此，然后我添加一些代碼來切換打開/關閉每個手風琴面板，並在單擊時向上/向下箭頭切換：

$(document).on('click','.accordion h3', function () {
    $(this).find('span').toggleClass("arrow_down arrow_up");
    $(this).next('div').toggle();
    var containerPos =  $(this).offset().top;
    $('html, body').animate({ scrollTop: containerPos }, 200);
});

然后，僅基礎回調起作用，而不起作用。 因此，它們都可以單獨工作，但是當我在腳本中同時擁有這兩者時，僅基礎回調起作用。 我怎樣才能使它們同時工作？

Answer 1

您可以使用data-options =“ one_up：true;” 折疊您手風琴的內容。 例如：

<div data-options =“ one_up：true;” data-section =“ accordion” class =“ section-container手風琴”> </ div>