Смена бекграунда в зависимости от разрешения экрана

Тема в разделе "Веб-дизайн", создана пользователем ftpman, 24 дек 2009.

Статус темы:
Закрыта.
Модераторы: zek24
  1. ftpman

    ftpman

    Регистр.:
    13 июн 2008
    Сообщения:
    193
    Симпатии:
    64
    Здаров всем.
    Никак не могу реализовать одну идею.
    Задача такая:
    Имеется сайт на джумле. И имеется под него фон, сделанный специально под этот сайт.
    Фон задуман во всю ширину, ну а в высоту как получится, дизайнерша долго парилась.
    Идея такая что бы сделать сайт, и разместить модули таким образом что бы фон было видно, и создавалось впечатление что типо мы там где нужно, ну что то типо того.
    Но появилась проблема - о боже фон обрезается в зависимости от разрешения экрана и т.д.
    Вот он http://autolance.ru/ сайт в стадии разработки, вот прежняя версия: euromodatrade.ru
    Кароче сейчас фон стоит 1600x1200px, у тех у кого меньше разрешение,фон в ширину режется.
    Мои идеи и варианты реализации:

    0. Думал обрезать края, которые должны точно показываться, засунуть в див главный див назовём wrap, потом кусок верха в новый див, середины и т.д. с точными размерами. Но всё что имеется на фотки по любому поместить не удастся. Да и гемор

    1. background-image stretch от css3 - эт хня полная,уже реализовывал сайт тормозит, и фотка растягивается в общем дерьмо вариант!

    2. С помощью резины но бляха муха там же фон целая фотка громадная, едрить колотить её, я не хочу верстать заново.

    3. Думаю сделать под каждое разрешения экрана свой ФОН С КАРТИНКОЙ.
    Реально ли такое? с js не особо дружу, да и с php тоже. Так что если вы сталкивались с этим, помогите плз.

    p.s. гууглил но что то нихрена не нашёл на эту тему.
     
  2. mdss

    mdss ♖♘♗♕♔♗♘♖

    Moderator
    Регистр.:
    20 фев 2007
    Сообщения:
    1.126
    Симпатии:
    668
    1) фон повторяется в любом случае (у меня справа заново картинка начинается), так что не вижу смысла делать такие манипуляции. ИМХО лучше фон тупо отцентрировать и все
    2) есть js для смены css, в зависимости от разрешения экрана
    Код:
    http://www.google.ru/search?q=js+%D1%81%D0%BC%D0%B5%D0%BD%D0%B0+css+%D0%B2+%D0%B7%D0%B0%D0%B2%D0%B8%D1%81%D0%B8%D0%BC%D0%BE%D1%81%D1%82%D0%B8+%D0%BE%D1%82+%D1%80%D0%B0%D0%B7%D1%80%D0%B5%D1%88%D0%B5%D0%BD%D0%B8%D1%8F&ie=utf-8&oe=utf-8&aq=t&rls=org.mozilla:ru:official&client=firefox
     
  3. iskif

    iskif

    Регистр.:
    21 авг 2006
    Сообщения:
    325
    Симпатии:
    35
  4. ftpman

    ftpman

    Регистр.:
    13 июн 2008
    Сообщения:
    193
    Симпатии:
    64
    Да я после первого поста увидел реализацию, да действительно работает сенкс.
    Код:
    <script language="JavaScript" type="text/javascript">
    var height=0;
    var width=0;
    if (self.screen) {   
           width = screen.width
           height = screen.height
    }
    else if (self.java) { 
          var jkit = java.awt.Toolkit.getDefaultToolkit();
          var scrsize = jkit.getScreenSize();      
          width = scrsize.width;
          height = scrsize.height;
    }
    if (width <= 800 && height == 600) {
    document.write("<link rel='stylesheet' type='text/css'template800.css'>");
    }else if(width == 1024 && height <= 768){
    document.write("<link rel='stylesheet' type='text/css'template1024.css'>");
    }else if(width <= 1280 && height <= 1024){
    document.write("<link rel='stylesheet' type='text/css'template1280.css'>");
    }else if(width <= 1360 && height <= 1024){
    document.write("<link rel='stylesheet' type='text/css'template1360.css'>");
    }else if(width <= 1440 && height <= 1080){
    document.write("<link rel='stylesheet' type='text/css'template1440.css'>");
    }else if(width <= 1600 && height <= 1200){
    document.write("<link rel='stylesheet' type='text/css'template1600.css'>");
    }
    </script>
     
  5. PowerUSB

    PowerUSB Постоялец

    Регистр.:
    22 сен 2008
    Сообщения:
    110
    Симпатии:
    22
    а можно реализовать средствам php)
    определять расширение пользователя, и под каждое ставить опред фон.
     
  6. STRAIKER

    STRAIKER Постоялец

    Регистр.:
    10 сен 2006
    Сообщения:
    131
    Симпатии:
    27
    А как Вы узнаете разрешение пользователя через PHP?) Я вот лично так не умею. :(
    Если только получать разрешение через js, передавать его php скрипту и там уже прописывать условия. Но смысла в таком изнасиловании мозга, я не вижу.
     
  7. rafic

    rafic

    Регистр.:
    14 май 2008
    Сообщения:
    477
    Симпатии:
    24
    К стати... а не рациональнее ли порезать фон на картинки...сверстать пусть даже то же таблицей и патом засунуть на фон?? ибо грузитса невероятно долго...ну а таблицу как сказали выше отцентрировать... а по краям на картинках сделать плавный переход к какому-то цвету и патом на бекграунт body поставить этот цвет ...и тогда думаю буде все гуд:))
     
  8. ftpman

    ftpman

    Регистр.:
    13 июн 2008
    Сообщения:
    193
    Симпатии:
    64
    ну я же сразу сказал что резина дерьмо, резать просто офигеть сколько, да и тем более один фон платный переход сделать не получится.
     
Статус темы:
Закрыта.