Question

我有奇怪的问题。我在css和javascript中创建了一个侧边菜单，在页面的一侧显示购物车，但当购物车内容更改时，它会从屏幕上消失。

我做了一个jsfiddle来隔离问题的代码，但问题是：我无法用jsfiddle版本重现这个bug，我找不到为什么会有这个bug。

这是了解代码的jsfiddle：

// when click show side panel
    $('#' + prefix + '-btn').click(function () {
        $(this).toggleClass('open');

        // Hide all other boxes
        var boxes = $('.box-container');
        $.each(boxes, function (index, box) {
            if ($(box).data('prefix') != prefix)
                hideBoxes($(box).data('prefix'), true);
        });
        var right = $('#' + prefix + '-container').css('right');
        var width = $('.' + prefix + '-box').outerWidth();
        var rightHide = '-' + width.toString() + 'px';

        var zindex = 180;
        if (right != '0px') {
            rightHide = '0px';
            zindex = 1000;
            $('#cart-container').css('z-index', zindex);
        }

        $('#' + prefix + '-container').stop(true, true).animate({ right: rightHide }, 800, function () {
            // Animation complete.
            $('#cart-container').css('z-index', zindex);
        });

        return false;
    });

    // hide after loading
    hideBoxes(prefix, false);

    // recalculate when div resized
    $('.' + prefix + '-container').bind('DOMSubtreeModified', function () {
        if (window[prefix + 'width'] != $(this).width())
            hideBoxes(prefix, false);

        window[prefix + 'width'] = $(this).width();
        window[prefix + 'height'] = $(this).height(); // pas utiilise pour le moment
    });

    // recalculate when window resize
    $(window).resize(function () {
        hideBoxes(prefix, false);
    });

    // Follow window scroll
    $(window).scroll(function () {
        if ($(window).scrollTop() > 80) {
            //$('#' + prefix + '-container').animate({ top: (defaultTop - 80) }, 200);
            $('#' + prefix + '-container').css('top', (defaultTop - 80) + 'px');
        } else {
            $('#' + prefix + '-container').stop(true, true).css('top', defaultTop + 'px');
        }
    });
}

在这里我有这个bug的网站：

http://goo.gl/UWrIHy

要重现它，只需在移动Safari（ipad或iphone）中找到此网址，将项目添加到购物车（第一次添加项目时它将消失＆lt; - bug）并重新加载页面。每次完成从服务器重新加载购物车时，购物车菜单都会消失...

如果有人理解这个错误，我会非常感激

当移动野生动物园的大小改变时，Css侧面菜单消失

0 个答案: