Question

我有一段HTML，我想在点击动画div时动画，并在再次点击时关闭。 HTML：

queryset=Address.objects.none(),

JQuery的：

<a href="#" class="menu_greyed performance_menu_trigger">My Details <span class="push_right">&#x25BC;</span></a>
<div class="performance_menu_holder">
<a href="details" class="push_right performance_menu_item">Details</a>
</div>

首次点击它时会打开它，但是当它打开时它不会打开。它并没有关闭div。

Answer 1

＆＃13;

$(document).ready(function(){
        $('.performance_menu_holder').hide()
        $('.performance_menu_trigger').click(function(){
            $('.performance_menu_holder').slideToggle({ "opacity" : "show", bottom: "100" }, 500);
            $('.performance_menu_trigger').addClass('performance_menu_trigger_close');
        });
        $('.performance_menu_trigger_close').click(function(){
            $('.performance_menu_holder').slideToggle({ "opacity" : "show", top: "100" }, 500);
            $('.performance_menu_trigger').removeClass('performance_menu_trigger_close');
        });
    });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<a href="#" class="menu_greyed performance_menu_trigger">My Details <span class="push_right">&#x25BC;</span></a>
<div class="performance_menu_holder">
<a href="details" class="push_right performance_menu_item">Details</a>
</div>

＆＃13;

您可以使用slideToggle而不是动画。

$(document).ready(function(){
    $('.performance_menu_holder').hide()
    $('.performance_menu_trigger').click(function(){
        $('.performance_menu_holder').slideToggle({ "opacity" : "show", 
bottom: "100" }, 500);

$('.performance_menu_trigger').addClass('performance_menu_trigger_close');
    });
    $('.performance_menu_trigger_close').click(function(){
        $('.performance_menu_holder').slideToggle({ "opacity" : "show", top: "100" }, 500);
        $('.performance_menu_trigger').removeClass('performance_menu_trigger_close');
    });
});

Answer 2

我已经获得了：

$(document).ready(function(){
        $('.performance_menu_holder').hide()
        $('.performance_menu_trigger').click(function(){
            $('.performance_menu_holder').slideToggle("fast");
        });
    });

单击触发器并关闭同一按钮时，JQuery动画并打开div

2 个答案: