Мелкие проблемы адаптивной верстки интернет магазина

[parnas]

Здравствуйте, коллеги!

Обрашаюсь вам за советы и решении некоторых проблем верстки.

1.  На каталоге есть карточка товаров. При наведении появляются дополнительные значки внизу. У этих значков есть подсказка при наведения. Проблема в том что подсказка значков второго ряда уходить за контент карточек товаров которые расположены на следующем ряде хотя z-index задать выше. Самое странное для меня в том что, в планшетном и мобильном версии этой проблемы нет. В чем причина?

2. В проекте использовал slick слайдер. На главном и на странице товара есть слайдер и слайдшоу соответственно. Проблема в том, при загрузки страницы сперва изображении слайдера и слайд шоу загружается во вертикальном порядке и только после полной загрузки страницы, все станет на свои места. Как это исправить?

3. На левом краю есть панель конфигуратора. На мобильном версии чтобы вызвать эту панель на верху есть кнопка с иконкой шестеренка. Сейчас при нажатии на эту кнопку конфиг панель открывается, но при повторном нажатии ведет себя как на десктопе. То есть, полностью не исчезает. Эту задачу никак не мог решать. Наводки и советы очень помог бы.

 

Всем заранее огромное спасибо за любую помощь!

[radioactive]

1

.catalog-item
 &:hover
  z-index: 1

2

попробуйте скрыть его до полной загрузки страницы, например за loader'ом

3

в скрипте при нажатии на открытие меню, классу config дается класс show но не убирается при повторном нажатии

.find('.config').addClass('show');

Edited December 4, 2016 by radioactive

[parnas]

1. Сделал. Сработало. Огромное спасибо.

2. Никогда не пользовался load ом . Не подскажите как? Можеть быть где то есть пример на похожую проблему.

3. Тут конфиг открываеться событием trigger() который инициализируються за .find('.config').addClass('show') Как бы я не старался(неверно знание и опыта не хватило) не смог убирать класс 'show' при повторном нажатие. Вот скрипт который открывает конфиг панел . А этот открывает конфиг панел из мобилной версии.

[parnas]

2 - проблема тоже решена. Пришлось подправить css. Если кто-то используеть slick.js и столкнулся подойной проблемой , вот issue на githube.

[parnas]

В каталоге обнаружил еще один bug. при Наведение на карточку товара оно увеличиваеться через transform scale. Но шрифт  замыливается. Как можно избавиться от этого? -webkit-transform-style: preserve-3d;  -webkit-backface-visibility:hidden; не помогло.