Конфликт Owl Carousel с Masonry. Абсолютное позиционирование и переполнение

Ссылка на демонстрацию (измените размер окна до ширины примерно 768 пикселей)

Таким образом, очевидно, наличие ползунка карусели совы внутри предмета каменной кладки заставляет его сходить с ума. Как вы можете видеть по ссылке, когда вы изменяете размер браузера. Я думаю, что нашел, в чем проблема, хотя я не знаю, как ее решить. Если вы немного проанализируете карусель совы, вы увидите, что есть div с атрибутом overflow:hidden, который является ключевым, если вы хотите, чтобы отображался только один элемент ползунка. Вот кикер. Этот атрибут overflow: hidden НЕ работает, когда ЛЮБОЙ из его родителей абсолютно позиционирован. Буквально, даже если он вложен в 15 элементов, если тело абсолютно позиционировано, произойдет очевидный конфликт. Любые идеи?

Спасибо :)


jquery css masonry
person iTakeHome    schedule 13.03.2015    source источник
comment
Просто половинчатое решение: .bp-holder{max-width: 100%;} решит проблему ширины. Но не решит проблему высоты/верхнего положения каменной кладки.   -  person Steffi A.    schedule 13.03.2015
comment
Да, сам так делал, даже решением не назову, но спасибо :)   -  person iTakeHome    schedule 13.03.2015

Ответы (1)


arrow_upward
0
arrow_downward

Я нашел решение вашей проблемы.

            onResize: function(){
                setTimeout(function(){
                    var msnry = Masonry.data( '#imagesarea' );
                    msnry.layout();
                },200);
            }

Надеюсь, поможет ;)

person Tiago Couto    schedule 14.05.2015