1

CSS3 属性を処理するプラグインを既に使用しています。クリックすると機能し、45 度回転しますが、コンテンツを非表示にするためにもう一度クリックしても元に戻りません。これを機能させる方法について何か考えはありますか？

$("#faq dt").click(function() {
    $(this).next('dd').slideToggle('fast');
if ($(this).next('dd').is(':visible')) {
 $(this).children('span').transition({ rotate: '45deg' });
 }
else {
 $(this).children('span').transition({ rotate: '-45deg' });
 }
});

ライブ サイトはこちらからご覧いただけます: http://www.revival.tv/lastdays/

作業スニペット:

$("#faq dt").click(function() {
$(this).next('dd').slideToggle('fast', function() {
    if ($(this).is(':visible')) {
         $(this).prev('dt').children('span').transition({ rotate: '45deg' });
    } else {
         $(this).prev('dt').children('span').transition({ rotate: '0deg' });
    }
 });
});
4

4 に答える 4

1
于 2012-08-28T00:56:22.227 に答える
0

クラスに回転を配置してから、JavaScriptを使用してクラスを追加および削除して、前後にフリックしてみませんか？

于 2012-08-28T00:51:02.053 に答える
0

ここで簡単な修正を行います：

$("#faq dt").click(function() {
    $(this).next('dd').slideToggle('fast');


    if (!$(this).next('dd').hasClass('collapsed')) {
        $(this).children('span').transition({
            rotate: '45deg'
        });
        $(this).next('dd').addClass('collapsed');
    }
    else {
        $(this).children('span').transition({
            rotate: '0deg'
        });
        $(this).next('dd').removeClass('collapsed');
    }
});​

そして、ここで動作しているのを見ることができます: http://jsfiddle.net/crisboot/6Aj9e/

于 2012-08-28T01:11:12.663 に答える
-1

これは、基本的な回転機能の簡単なフィドルです。実装はあなたに任せます:)

于 2012-08-28T00:42:01.783 に答える