Поддержка Темы и шаблоны Отображение на мобильных устройствах

  • Решено suaveslow

    (@suaveslow)


    У меня следующая проблема, на главную страницу сайта установил слайдер(плагин vSlider), на компьютере все отображается идеально, при различных размерах слайдера. Если просматривать на мобильном устройстве, слайдер выезжает за границу страницы.

    Думаю, что проблема в следующем, ширина страницы задана в процентах(80% от ширины экрана), а размер слайдера задается в пикселях, получается, что на мобильных устройствах не хватает ширины экрана.

    Пробовал задать ширину страницы в пикселях, а размер слайдера меньше нее, тогда все идеально, но это не выход, т.к. шаблон перестает быть резиновым…

    Нужно сделать размер слайдера резиновым, но в настройках этого нет(задается только в пикселях), либо добавить отдельный стиль для мобильных устройств. Но вот как это сделать? Может есть еще какие-то варианты решения?

Просмотр 13 ответов — с 1 по 13 (всего 13)
  • Автор suaveslow

    (@suaveslow)

    или например можно отключить белый фон листа на главной?
    чтобы только слайдер и все?

    Автор suaveslow

    (@suaveslow)

    сайт vozduhoplavateli74.ru

    Для нужных разрешений можно попробовать воспользоваться правилом @media, т.е. на маленьких разрешениях убирать или фон или слайдер или еще что-то придумать. Как воспользоваться описано тут htmlbook.ru/css/media.

    Автор suaveslow

    (@suaveslow)

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

    Идентификатор блока слайдера «vslider_options» пользуясь правилом можно, например, написать так в хвост style.css:

    @media (max-width: 830px) {
    	#vslider_options  {
    		width:600px;
    	}
    }

    хм…
    попробовал, но к сожалению не работает 🙁

    Странно. Но посмотреть не могу, Ваш сайт is Down for Maintenance.

    Прошу прощения, просто закрыл его на время разработки.
    Теперь открыт

    Сейчас я вижу запись в стилях:

    @media  (max-width: 600px) {
    	#islidex_options  {
    		width:500px;
    	}
    }

    Это другой блок, его вообще нет в разметке.

    я делал блок:

    @media  (max-width: 600px) {
    	#vslider_options  {
    		width:500px;
    	}
    }

    потом ставил другой слайдер, не помогло.
    Сейчас сделал такой блок, как сказали вы, включил vSlider, отображение на мобильных устройствах все равно хромает. По-крайней мере на моем HTC и на iPad 3 моего друга.

    Эм… Вопщем, я говорил и указал для конкретного примера, разные слайдеры — разные блоки — разный код.

    Ну и на том спасибо. Буду разбираться.

    решил проблему установкой слайдера RoyalSlider. Есть возможность указать щирину в процентах, благодаря чему слайдер сам подстраивается под размер экрана, так же как и шаблон.

Просмотр 13 ответов — с 1 по 13 (всего 13)
  • Тема «Отображение на мобильных устройствах» закрыта для новых ответов.