Слайдер фоновых изображений и мобильные устройства

[masterlan]

Привет народ.
Вообщем дело вот в чем - в шаблоне работает слайдер фоновых изображений bgstretcher .
На главной странице слайдятся несколько изображений, на второстепенных по одному изображению.
Выглядит так - фоновое изображение фиксированных размеров (h:1600 ; w: 964)
На нем вся страница. Фоновое на месте, страниа скроллится.
На больших экранах выглядит норма.
А вот на мобильных - фигня. (второе вложение)

В header прописан bgstretcher так:

В css он описан так:

Получается, что исходное изображение очень большое, и широкое. А на телефоне оно отображается не пропорционально из-за разрешения экрана.

Как привести вид сайта на моб девайсах в норму?
Думал на счет @media , по размеру экрана подгружать нужного размера бэкграунд - в css, но не могу придумать как описать для слайдера.

Может заменить слайдер, на какой?
Кто что посоветует?

 

[dreadw1nd]

Если заменять, можно попробовать на Royal Slider, использовал в нескольких проектах, показал себя весьма неплохо.
Заменить слайдер 1 статичной картинкой?
Прописать размер картинки через @media (хотя в теории не отработает)
Изменяем, хотя дивный костыль тогда выходит... В общем,

.bgstretcher img {
height: 80% !important;
}

Хотя может и меньше 80%, нужно смотреть...

 

[masterlan]

Я так себе понимаю - в моем случае, должно быть каждое изображение из слайдера в нескольких вариантах по разрешению, и слайдер должен в зависимости от экрана их показывать на странице... Теория...
Заменить слайдер одной страницей можно, но заказчик не одобрит.
@media не будет работать для слайдера?
80% это вы для чего имели ввиду?

Этот слайдер вообще все ломает. Но заказчику нравится.

Правильно ли я понял что для страниц на которых статическое изображение, можно указывать свойство

?

 

[dreadw1nd]

Не совсем, как я понимаю, класс .bgstretcher img отвечает за размер изображения, который используется вами в слайдере, соответственно изменяя этот размер, мы должны в теории получить другую высоту картинки.

Но у вас проблема в другом, полистав немного документацию, видно что у вас не корректно отрабатывает часть скрипта, которая отвечает за resize.

resizeProportionally true - Indicates if background image(s) will be resized proportionally or not.

В вашем же случае, картинка сжимается не пропорционально, проверьте, есть ли ошибки в консоли разработчика.