Почему при смене слайда дергается бекграудная картинка блока?

Question

[ligisayan]

Всем привет! Есть сайт на wordpress, в котором в разделе типов панелей при смене слайда дергается бекграудная картинка раздела

#new-tab {
    background: url(images/panel-section.jpg) no-repeat;
    background-size: cover;
    position: relative;
    padding-top: 70px;
    padding-bottom: 80px;
    width: 100%;
    min-height: 1069px;
}

Почему так происходит и как это можно поправить?

Comments

[Игорь Воротнёв]

Зачем тег "WordPress"? Вопрос исключительно по стилям.

Answer 1

[Никита Кит]

задай для .tab-content или для #new-tab фиксированную ширину ( height со значением в пикселях). Лучше с запасом - для контента.

Comments

[Никита Кит]

На самом деле, можно даже круче. Есть jQuery. Возьми высоту элемента со строчным контентом, сохрани её в переменную и отдавай (в расчёт с другими дочерними элементами) в высоту родителя после загрузки страницы. Можно немного посчитать, если есть желание изъ*нуться. (sorry)

[ligisayan]

Никита Кит: понял вас, было дело когда-то уже считал подобное - еще плагины минимизации и кеширования нужно было учитывать - нет желание этим заморачиваться, только нагружать сайт. а если скрипты буду отключены в браузере - тогда вообще беда. лучше пусть 1 раз фон сдвинется при большом описании, чем все подскакивать и подгружаться постоянно будет

[Никита Кит]

ligisayan: верно. На будущее просто подобные штуки стели через background-image + его дополнительные свойства. Тогда блоку заде не потребуется фиксированная высота, если положение фона будет определено через не менее фиксированный background-position.
Фиксированная высота для блока, в который падает контент из базы - это говнокод. Я даже сегодня посрался со своим аккаунт-менеджером на работе за эту тему.

Answer 2

[Максим]

потому что высота блока #new-tab меняется в зависимости от контента снизу и картинка растягивается больше

Comments

[ligisayan]

Максим да, спасибо, я это тоже заметил - это поддается правке?

[iBird Rose]

ligisayan: задай для #front-page #new-tab background-size: не cover, а 110% к примеру

[Максим]

ligisayan: можно этому блоку задать фикс. высоту и всё будет ок clip2net.com/s/3EO5DSr

[ligisayan]

да, Максим: даже еще изящнее сделал - задал min-height на случай, если уже будет огромный блок, то только раз съедет и убрал отступ у блока снизу, спасибо

[ligisayan]

iBird Rose: к сожалению, 110% не решило проблему, а вот min-height у контент блока - да!