ищу Шаблон с фоновой картинкой на весь экран, резиновый

Тема в разделе "Выбор шаблона", создана пользователем Jedai, 01.12.2008.

  1. Offline

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

    Регистрация:
    01.12.2008
    Сообщения:
    45
    Симпатии:
    0
    Пол:
    Мужской
    Привет, я пока новичек.

    Нужен шаблон, в котором можно картинку jpg 1024х768 ( разметить фоном в шаблоне), чтобы при ресайзе сайта - резайзелась картинка - относительно(гармонично со всеми кнопками)
     
  2.  
  3. Wild Tiger
    Offline

    Wild Tiger Недавно здесь

    Регистрация:
    14.07.2008
    Сообщения:
    190
    Симпатии:
    11
    Пол:
    Мужской
    а у кого разрешение экрана больше 1024 будут полосу справа наблюдать?
    Фоновая картинка ресайзиться не может.
    Картинка 1024х768 весит больше 100 кб, т.е. страница будет грузиться долго. Пользователю это надо?
     
  4. Offline

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

    Регистрация:
    01.12.2008
    Сообщения:
    45
    Симпатии:
    0
    Пол:
    Мужской

    я предупреждал, что грузиться будет долго, но человек хочет и всё, какие только доводы не приводил, эх, собствено и хотел узнать как можно картинку сделать фоном

    oceano-spb.ru - текщий пример
     
  5. Offline

    _voland_ специалист

    Регистрация:
    12.04.2008
    Сообщения:
    2 173
    Симпатии:
    102
    Пол:
    Мужской
    Можно растянуть или в ширину или в высоту... другое измерение растянется пропорционально..
    вариант 2 - использовать JavaScript :)
     
  6. Offline

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

    Регистрация:
    01.12.2008
    Сообщения:
    45
    Симпатии:
    0
    Пол:
    Мужской
    сильно не ругайте - вот что сделал на CSS

    http://oceano-spb.ru/index_resize.php

    все резайзится (при ресайзании браузера), но вот думаю стоит ли так извращаться
     
  7. doctorgrif
    Offline

    doctorgrif специалист

    Регистрация:
    14.01.2008
    Сообщения:
    1 284
    Симпатии:
    66
    Пол:
    Мужской
    1. пушкинские строки и пушкин за листом папируса
    2. ресайз на широкоформатных мониторах превращает пушкина в лицо, страдающего ожирением 2 ст.
    3. шрифт смазывается
     
  8. Offline

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

    Регистрация:
    01.12.2008
    Сообщения:
    45
    Симпатии:
    0
    Пол:
    Мужской
    ктстати наоборот, папирус - резайзится и в ширь и в длину, а пушкин остается нормальным, если бы пушкин был бы на месте папируса, то был бы шанс у него ожиреть. х.з. как также побороть папирус
     
  9. -=phenix=-
    Offline

    -=phenix=- Недавно здесь

    Регистрация:
    01.09.2008
    Сообщения:
    64
    Симпатии:
    2
    Пол:
    Мужской
    1 цельная картинка на фоне в дизайне .... да еще и в стандартном - не бывает такого...
    Это противоречит идеям тянущегося дизайна - когда страница тянется вниз, при дополнении в нее информации ...

    Но, если быть откровенным, в последней работе я использовал этот метод, для главной страницы сайта. Шо делать - заказчик всегда прав, и его ен волнует что у когото дома нету мегабита. Собственно и сайт ориентирован на народ такой ... не бедный...

    Для этого были отрисованны 3 версии фона - 1024, 1280 и 1600

    Потом я определял размер экрана и в зависимости от этого прогружал свою версию css:

    <Script language="JavaScript" type="text/javascript">
    var height=0;
    var width=0;
    colorDepth = screen.colorDepth;
    if (self.screen)
    {
    width = screen.width
    height = screen.height
    }
    else if (self.java)
    {
    var jToolKit = java.awt.Toolkit.getDefaultToolkit();
    var scrsize = jToolKit.getScreenSize();
    width = scrsize.width;
    height = scrsize.height;
    }

    if (width < 1024)
    width = '1024';

    if (1024 < width && width < 1280)
    width = '1024';
    if (width > 1280)
    width = '1600';

    document.write ( "<link rel=\"stylesheet\" href=\"<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/css/template" + width + ".css\" type=\"text/css\" />");
    </script>

    То есть под каждое разрешение- своя версия стилей.
    Итог лежит тут: http://www.ruslan-i-ludmila.od.ua/
     
  10. -=phenix=-
    Offline

    -=phenix=- Недавно здесь

    Регистрация:
    01.09.2008
    Сообщения:
    64
    Симпатии:
    2
    Пол:
    Мужской
    Что мне не нравится - фоны в твоей версии верстки (дизайна) можно сделать достаточно размытыми - (то есть по размеру маленькими)
    Но что бы хорошо смотрелись Логотипы и другие надписи - я бы использовал png прозрачные файлы
    тут на форуме посоветовали плагин http://www.joomlaworks.gr/ который сам корректирует для ИЕ 6 (и прочего кто не понимает прозрачности).
    Вот смотри - как на сайте выводятся 2 логотипа :

    <div id="main_header">
    <h1> </h1>
    <h2> </h2>
    </div>

    А вот соответствующий код css

    div#main_header { height:420px;}
    div#main_header h1 {display:block; float:left; overflow:hidden; line-height:9999px; background:url(/bg_logo_main.png) no-repeat;}
    div#main_header h2 {display:block; float:left; overflow:hidden; line-height:9999px; background:url(/bg_header_adv.png) no-repeat;}

    Фон размыт - а логотипы - png четкие

    Теперь панель ввода:
    <div id="main_content">
    <div id="main_content_start"></div>
    <div id="main_content_body" class="clearfix">
    <p>Представляем вашему вниманию ..... </p>
    </div>
    <div id="main_content_end"></div>
    </div>

    В css:
    div#main_content { width:380px; float:right; margin-top:80px;}
    div#main_content_start {width:380px; height:38px; background:url(../images/bg/bg_maincontent_start.png) no-repeat bottom;}
    div#main_content_end {width:380px;height:38px; background:url(../images/bg/bg_maincontent_end.png) no-repeat top;}
    div#main_content_body {width:300px;background:url(../images/bg/bg_maincontent.png) repeat-y; color:#138ce4; padding:0 40px;}

    Есть начало блока -_start конец - _end и тело _body. Все это заключено в контейнер
    Такое деление позволяет растягивать текст внутри блока.
     
  11. Offline

    _voland_ специалист

    Регистрация:
    12.04.2008
    Сообщения:
    2 173
    Симпатии:
    102
    Пол:
    Мужской
    Сайт доделан? А то выглядит ужасно.. вся верстка ползет :(
     
  12. Offline

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

    Регистрация:
    01.12.2008
    Сообщения:
    45
    Симпатии:
    0
    Пол:
    Мужской
    красиво исполнен сайт!!!! эх мне бы так уметь......

    вопрос: можно ли както сделать, чтобы при резайзе сайта в браузере, невозможно было сделать ширину такуюже или меньше чем длина? (хотябы на яве)? если да, то как?
     
  13. -=phenix=-
    Offline

    -=phenix=- Недавно здесь

    Регистрация:
    01.09.2008
    Сообщения:
    64
    Симпатии:
    2
    Пол:
    Мужской
    _voland_, Сайт в стадии наполнения и тестирования пока что :) Я вне форума к те постучусь Ок?
     
  14. -=phenix=-
    Offline

    -=phenix=- Недавно здесь

    Регистрация:
    01.09.2008
    Сообщения:
    64
    Симпатии:
    2
    Пол:
    Мужской
    Jedai, Как то вот так:

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Окно 300 на 300 и никаких гвоздей!</title>
    </head>
    <script language="javascript" type="text/javascript">
    function ModifyWindow (){
    window.moveTo(0,0);
    window.resizeTo(300, 300);
    }
    </script>
    <body onload="ModifyWindow ()" onresize="ModifyWindow ()">
    </body>
    </html>
     
  15. Offline

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

    Регистрация:
    07.01.2009
    Сообщения:
    4
    Симпатии:
    0
    у меня разрешение 1600, но сайт не развернут на весь экран, что-то видимо не срабатывает.
     

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

Загрузка...