0

我的测试站点有问题：

http://devauth.labscope.de/htmlapp/report-overview.html

我的问题是：当我将浏览器窗口缩放到 768px 宽度时，会出现一个带有两个图标（左和右）的标题。当我单击它们时，相应的菜单会通过滑动动画进行切换。当我再次单击右侧图标时，没有任何反应。你能告诉我为什么会这样吗？

这是我的 jQuery 代码：

 jQuery('#content, #footer').each(function() {
            $(this).data('left', this.style.left);
        });

        jQuery('.category').on("click", function(e){
            e.preventDefault();

            var state   = $(this).data('state'),
                wrapper = $('#content').data('left'),
                footer  = $('#footer').data('left');


            jQuery("#content").animate({
                left: state ? wrapper : 250,
                duration: 1000
            }, "normal");

            jQuery("#footer").animate({
                left: state ? footer : 250,
                duration: 1000
            }, "normal");

            jQuery(this).data('state', !state);
        });

    jQuery('#content, #footer').each(function() {
        $(this).data('right', this.style.right);
    });

    jQuery('.filter').on("click", function(e){
        e.preventDefault();

        var state   = $(this).data('state'),
            wrapper = $('#content').data('right'),
            footer  = $('#footer').data('right');

        jQuery("#content").animate({
            right: state ? wrapper : 250,
            duration: 1000
        }, "normal");

        jQuery("#footer").animate({
            right: state ? footer : 250,
            duration: 1000
        }, "normal");

        jQuery(this).data('state', !state);


    });

我希望有人可以帮助我修复这个错误。

4

1 回答 1

1

不要Right以 250 设置动画，而是尝试left以 -250 设置动画。

于 2013-10-10T12:00:35.583 回答