滑出菜单不滑出

Question

您好，我创建了一个滑出式菜单，但我的菜单也有一个手风琴，它也使用 JavaScript 和 j 查询。

为了让手风琴工作，我使用了这个“//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js”>

为了让滑出菜单真正滑出，我使用了“//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js”

但我似乎无法正常工作。目前，滑块从屏幕的角落而不是侧面出现。有没有办法让两者都工作。

你看到它 http://teamnews.org/#

<script>

        /* Slide Out Menu code */

        $(function() {
            var menu = $("#menu");
            var clicked = false;
            $( "a.menu-trigger" ).click(function() {
                if(clicked){
                    menu.removeClass("menu-open");
                    $(".slide-out-menu").removeClass("slide-out-menu-clicked");
                    console.log('show');
                    clicked=false;
                }else{
                    menu.addClass("menu-open");
                    $(".slide-out-menu").addClass("slide-out-menu-clicked");
                    clicked=true;
                }
            });
        });

        jQuery(".container").append("<hr />");


        /* Accordion code */

            $(function() {
        $('#only-one [data-accordion]').accordion();

        $('#multiple [data-accordion]').accordion({
          singleOpen: false
        });

        $('#single[data-accordion]').accordion({
          transitionEasing: 'cubic-bezier(0.455, 0.030, 0.515, 0.955)',
          transitionSpeed: 200
        });
      });

       /* $('a.menu-trigger').click(function(){
            $('.slide-out-menu').animate({left: '0%'});
        });*/

    </script>

Answer 1

原因是您的上边距是百分比，将其更改为像素，它将保持不变。随着菜单变窄，顶部的百分比也会缩小，并使菜单项向上移动（因此动画左上角）

#only-one {
    margin-top: 150px;
}