0

这是关于菜单上的“Contato”项目。当您单击它时，它会在 div 中上下弹出高度。工作正常。另外，我想放一个“X”按钮。

问题是：当我点击“Contato”时，它会弹出。我点击X，它会弹出。但是如果我再次点击“Contato”，它只有在我点击两次时才有效。

你们对我如何改进我糟糕的jQuery来解决这个问题有任何想法吗？

这是现场直播： http ://www.arthurfalcao.com.br

<section id="contato">
            <article id="info">
                <p>21 8668 1419</p>
                <p>22 7836 4351</p>
                <p>87*146596</p>
                <a href="mailto:artfalcao@gmail.com" title="E-mail para contato" target="_blank">artfalcao@gmail.com</a>
            </article>
            <div class="contato">
                <span class="close">X</span>
                <?php echo do_shortcode("[si-contact-form form='1']"); ?>
            </div>
        </section>

        <script>
            jQuery("#menu-item-21 a").click(function () {
                jQuery(this).toggleClass("black");
            });
            jQuery("#menu-item-21").toggle(function(){
                jQuery("#contato").animate({height:375},600);
                jQuery("#info").animate({height:0},700);},
                function(){
                jQuery("#contato").animate({height:150},600);
                jQuery("#info").animate({height:115},700);
            });

        </script>
        <script>
            jQuery(".close").click(function () {
                jQuery('#contato').animate({height:150},700);
                jQuery("#info").animate({height:115},700);
            });
            jQuery("#menu-item-21 a").click(function () {
                jQuery(this).removeClass("black");
            });         
        </script>
4

1 回答 1

0

改变这个

       jQuery(".close").click(function () {
            jQuery('#contato').animate({height:150},700);
            jQuery("#info").animate({height:115},700);
        });

至

       jQuery(".close").click(function () {
            jQuery('#menu-item-21').trigger('click');
        });

您遇到的问题是由于您使用.toggle. 现在，如果您单击 X，它会以动画方式关闭，但不会影响.toggle状态。相反，让 X 触发点击#menu-item-21，这样它就可以使用.toggle和影响切换状态。

于 2013-02-21T03:58:54.030 回答