0

どうしたの?: jQuery アコーディオンのアニメーションが壊れています。前のタブを閉じる前に次のタブを短時間クリックした後、以前に開いたタブを表示します。アニメーションもスライドしません。

CSS :この回答から見つかりました

/* The following was added into accordion.css */
.ui-accordion .ui-accordion-content { height: auto!important; }

jQuery

$(document).ready(function() {

    $("#accordion").accordion({ 
        active: false,
        fillSpace: false
    });

    $("#accordion").accordion("option", "active", false);
    $("#accordion").accordion("option", "fillspace", false);
});

私が試したこと: と の値をいじりましfillSpaceheight。accordion.css で試してみoverflow: visible!important;ましたが、フォーマットがめちゃくちゃでした。

私がしたいこと:各セクションのコンテンツの量に応じて、各セクションの高さを備えたクリーンなアニメーション<div>(上記のCSSで使用したもの)。

4

2 に答える 2

1

私が間違っていなければ、プラグインを使用していますか? そして、少なくとも私にとってはそれが問題です(予期しない動作のために嫌いです)。それで、少し前に自分のアコーディオンを作りました。そして、ここで実際の例を確認できます それがあなたを助けることを願っています!
これが私のコードです:

   $(document).ready(function() {

   $('.wrapper ul li ul:first').addClass('active');
   $('.wrapper ul li ul').hide();
   $('a.home,a.about,a.service,a.contact').click(function()     {
   if($('a.home,a.about,a.service,a.contact').next('ul').hasClass('active')) {
   $('.active').stop(true, true).slideUp('slow');
   $('.active').removeClass('active');
   $(this).next('ul').addClass('active');
   $('.active:not(:animated)').stop().slideDown('slow');
   }
   });
   });
于 2012-06-27T21:04:52.697 に答える
0

ちょっとばかげているように感じますが、false に設定するだけで、autoHeightコンテンツの少ないセクションの下の不要なスペースが取り除かれます。アニメーションも滑らかです。

$(document).ready(function() {

    $("#accordion").accordion({ 
        active: false,
        autoHeight: false, // ADDED
        collapsible: true
    });

    $("#accordion").accordion("option", "active", false);
    $("#accordion").accordion("option", "autoHeight", false); // ADDED
    $("#accordion").accordion("option", "collapsible", false);
});
于 2012-06-29T20:27:22.653 に答える