Вставить картинку в хедер во всю ширину на "рзиновом" сайте так, чтобы не появлялась полоса прокрутк

Тема в разделе "Изменение шаблона (кастомизация)", создана пользователем BIGFOOT, 02.02.2011.

  1. Offline

    BIGFOOT Недавно здесь

    Регистрация:
    15.01.2011
    Сообщения:
    15
    Симпатии:
    1
    Пол:
    Мужской
    Здравствуйте!
    Проблема в следующем: в шаблоне yoo_flux хочу разместить меняющуюся картинку в хедере во всю ширину экрана. Но так, чтобы при всех разрешениях она нормально выглядела (высота одинаковая, ширина чтобы сдвигалась, вместе с сайтом). Сделал изображения максимальной ширины 1920px, разместил при помощи модуля вывода случайного изображения в позиции абсолют (ссылка на образец шаблона и позиции модулей)
    Но получается так, что картинка всегда отображается целиком (во всю ширину) и на любом разрешении появляется горизонтальная полоса прокрутки.
    Наглядно:
    при 1920:
    [​IMG]
    при 1280:
    [​IMG]

    Подскажите, пожалуйста, как сделать желаемое (чтобы не появлялась горизонтальная полоса прокрутки)?
     
  2.  
  3. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    только при помощи тега
    Код (html):
    1. <img src="(тут путь до картинки)" width="(тут нужная ширина)" />

    или авто ресайзинг при помощи JS
     
  4. Offline

    BIGFOOT Недавно здесь

    Регистрация:
    15.01.2011
    Сообщения:
    15
    Симпатии:
    1
    Пол:
    Мужской
    А как это применить совместно с модулем случайной картинки?
    И ещё вопрос: <img src="(тут путь до картинки)" width="(тут нужная ширина)" /> Это просто задаёт ширину картинке? так я её и в фотошопе уменьшить могу.
    Нужно, чтобы "лишняя" часть картинки не отображалась, при сжимании сайта (просмотре на меньшем разрешении, чем ширина картинки)
     
  5. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    я что не написал что ли:
     
  6. Offline

    BIGFOOT Недавно здесь

    Регистрация:
    15.01.2011
    Сообщения:
    15
    Симпатии:
    1
    Пол:
    Мужской
    Нужен не совсем ресайзинг. высота картинки постоянная. если изображение ресайзить по ширине, не меняя высоты, то оно будет не очень хорошо выглядеть. Или ты имел в виду какой-то более гуманный вариант?

    пока придумал только такой вариант, чтобы не влезающая в экран часть не отображалась и не вызывала полосу прокрутки, но вот как это сделать не знаю. Поэтому и обращаюсь за помощью:[
     
  7. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    пропорциональный ресайзинг!!!!
    Код (CODE):
    1. overflow: hide;
     
    BIGFOOT нравится это.
  8. Offline

    BIGFOOT Недавно здесь

    Регистрация:
    15.01.2011
    Сообщения:
    15
    Симпатии:
    1
    Пол:
    Мужской
    Пропорциональное не подходит, т.к. высота меняться не должна.

    А вот это идея: overflow: hide; Просто и эффективно! как я не додумался :[

    Правда я другим способом уже решил, но всё равно с меня плюс =)
     
  9. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    тогда будет не красиво!!!
     
  10. Offline

    BIGFOOT Недавно здесь

    Регистрация:
    15.01.2011
    Сообщения:
    15
    Симпатии:
    1
    Пол:
    Мужской
    об этом я и писал в 5 сообщении темы =)
     
  11. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    не углядел :[
     
  12. Offline

    diokim Недавно здесь

    Регистрация:
    02.02.2011
    Сообщения:
    5
    Симпатии:
    0
    Пол:
    Мужской
    Друзья ПОМОГИТЕ! проблема с совместимостью в опере показывает ОК а в Эксплоуре фигня получается

    ИТАК добавил позицию в шаблон файл index.php
    <div class="logo">
    <div class="login2"><jdoc:include type="modules" name="login2" style="rounded"/></div>
    в файле css обозначил

    div.logo{
    height:180px;
    float:left;
    position:relative;
    --------------------------------------
    div.login2 {
    position:absolute;
    width:auto;
    bottom: 15px;
    right: 15px;
    background-color: #CA0202;
    border: 2px solid;
    border-color: #FFFFFF;
    border-radius:8px;

    Итого получилось все ОК в опере
    [​IMG]

    а в эксплорер

    [​IMG]

    Что делать то???? Кто ГУРУ???
     

Поделиться этой страницей

Загрузка...