шапка 100%

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

  1. samogon
    Offline

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

    Регистрация:
    29.10.2011
    Сообщения:
    4
    Симпатии:
    0
    Пол:
    Мужской
    [!!!]объясните Нубу есть сайт http://malorechka.org/
    вот такой вопрос
    есть 2 картинки одна 185*1000 px и вторая 185*1 px где что прописать чтобы шапка шаблона была резиновой
    картинка плавно масштабировалась заполняя по 1px с права на лево
    расскажите покажите плиз плюсики с меня
     
  2.  
  3. shurikkan
    Offline

    shurikkan Russian Joomla! Team Команда форума

    Регистрация:
    01.09.2011
    Сообщения:
    1 856
    Симпатии:
    162
    Пол:
    Мужской
    большую картинку вставляешь в шапку

    <img src="адрес-большой-картинки" align="right/center/left">


    а маленькую указываешь в стиле шапки

    background:url(адрес-маленькой-картинки) repeat-x;

    Получаем: шапка заполняется фоном по горизонтали, а сверху на фон наложена картинка.


    P.S.: при указании размеров изображения первая цифра - это ширина, вторая - высота.
     
  4. samogon
    Offline

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

    Регистрация:
    29.10.2011
    Сообщения:
    4
    Симпатии:
    0
    Пол:
    Мужской
    вот index.php
    Код (html):
    1. <?php
    2.  
    3.  
    4.  
    5. defined('_JEXEC') or die;
    6.  
    7. require_once dirname(__FILE__) . DIRECTORY_SEPARATOR . 'functions.php';
    8.  
    9. // Create alias for $this object reference.
    10. $document = & $this;
    11.  
    12. // Shortcut for template base url.
    13. $templateUrl = $document->baseurl . '/templates/' . $document->template;
    14.  
    15. // Initialize version-specific view.
    16. $view = $this->artx = ('1.6' == $GLOBALS['version']->RELEASE) ? new ArtxPage16($this) : new ArtxPage15($this);
    17.  
    18. // Decorate component with  style.
    19. $view->componentWrapper();
    20. ?>
    21. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    22. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $document->language; ?>" lang="<?php echo $document->language; ?>" >
    23. <head>
    24.  <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
    25.  <jdoc:include type="head" />
    26.  <link rel="stylesheet" href="<?php echo $document->baseurl; ?>/templates/system/css/system.css" type="text/css" />
    27.  <link rel="stylesheet" href="<?php echo $document->baseurl; ?>/templates/system/css/general.css" type="text/css" />
    28.  <link rel="stylesheet" type="text/css" href="<?php echo $templateUrl; ?>/css/template.css" media="screen" />
    29.  <!--[if IE 6]><link rel="stylesheet" href="<?php echo $templateUrl; ?>/css/template.ie6.css" type="text/css" media="screen" /><![endif]-->
    30.  <!--[if IE 7]><link rel="stylesheet" href="<?php echo $templateUrl; ?>/css/template.ie7.css" type="text/css" media="screen" /><![endif]-->
    31.  <script type="text/javascript">if ('undefined' != typeof jQuery) document._artxJQueryBackup = jQuery;</script>
    32.  <script type="text/javascript" src="<?php echo $templateUrl; ?>/jquery.js"></script>
    33.  <script type="text/javascript">jQuery.noConflict();</script>
    34.  <script type="text/javascript" src="<?php echo $templateUrl; ?>/script.js"></script>
    35.  <script type="text/javascript">if (document._artxJQueryBackup) jQuery = document._artxJQueryBackup;</script>
    36. </head>
    37. <body class="<?php echo $view->bodyClass(); ?>">
    38. <div id="page-background-glare">
    39.     <div id="page-background-glare-image">
    40. <div id="main">
    41. <div class="sheet">
    42.     <div class="sheet-tl"></div>
    43.     <div class="sheet-tr"></div>
    44.     <div class="sheet-bl"></div>
    45.     <div class="sheet-br"></div>
    46.     <div class="sheet-tc"></div>
    47.     <div class="sheet-bc"></div>
    48.     <div class="sheet-cl"></div>
    49.     <div class="sheet-cr"></div>
    50.     <div class="sheet-cc"></div>
    51.     <div class="sheet-body">
    52. </div>
    53.  
    54.  
    55.  
    56.  
    57. <div class="header">
    58.     <div class="header-centr">
    59.         <div class="header-jpeg"></div>
    60.     </div>
    61. <div class="logo"></div>
    62. <div class="headerlogo"></div>
    63. </div>
    64.  
    65.  
    66. <?php if ($view->containsModules('user3', 'extra1', 'extra2')) : ?>
    67. <div class="nav">
    68.     <div class="nav-l"></div>
    69.     <div class="nav-r"></div>
    70.     <?php if ($view->containsModules('extra1')) : ?>
    71.     <div class="menu-extra1"><?php echo $view->position('extra1'); ?></div>
    72.     <?php endif; ?>
    73.     <div class="nav-center">
    74.     <?php echo $view->position('user3'); ?> </div>
    75.     <?php if ($view->containsModules('extra2')) : ?>
    76.     <div class="menu-extra2"><?php echo $view->position('extra2'); ?></div>
    77.     <?php endif; ?>
    78. </div>
    79.  
    80.  
    81.  
    82.  
    83.  
    84.  
    85.  
    86. <?php endif; ?>
    87. <?php echo $view->position('banner1', 'nostyle'); ?>
    88. <?php echo $view->positions(array('top1' => 33, 'top2' => 33, 'top3' => 34), 'block'); ?>
    89. <div class="content-layout">
    90.     <div class="content-layout-row">
    91. <?php if ($view->containsModules('left')) : ?>
    92. <div class="layout-cell sidebar1">
    93. <?php echo $view->position('left', 'block'); ?>
    94.  
    95.   <div class="cleared"></div>
    96. </div>
    97. <?php endif; ?>
    98. <div class="layout-cell <?php echo $view->contentCellClass(array('left' => 'sidebar1', 'content' => 'content', 'right' => 'sidebar2')); ?>">
    99.  
    100. <?php
    101.  echo $view->position('banner2', 'nostyle');
    102.  if ($view->containsModules('breadcrumb'))
    103.    echo artxPost($view->position('breadcrumb'));
    104.  echo $view->positions(array('user1' => 50, 'user2' => 50), 'article');
    105.  echo $view->position('banner3', 'nostyle');
    106.  if ($view->hasMessages())
    107.    echo artxPost('<jdoc:include type="message" />');
    108.  echo '<jdoc:include type="component" />';
    109.  echo $view->position('banner4', 'nostyle');
    110.  echo $view->positions(array('user4' => 50, 'user5' => 50), 'article');
    111.  echo $view->position('banner5', 'nostyle');
    112. ?>
    113.  
    114.   <div class="cleared"></div>
    115. </div>
    116. <?php if ($view->containsModules('right')) : ?>
    117. <div class="layout-cell sidebar2">
    118. <?php echo $view->position('right', 'block'); ?>
    119.  
    120.   <div class="cleared"></div>
    121. </div>
    122. <?php endif; ?>
    123.     </div>
    124. </div>
    125. <div class="cleared"></div>
    126.  
    127.  
    128. <?php echo $view->positions(array('bottom1' => 33, 'bottom2' => 33, 'bottom3' => 34), 'block'); ?>
    129. <?php echo $view->position('banner6', 'nostyle'); ?>
    130. <div class="footer">
    131.     <div class="footer-t"></div>
    132.     <div class="footer-b"></div>
    133.     <div class="footer-body">
    134.          <?php echo $view->position('syndicate'); ?>
    135.         <div class="footer-text">
    136.   <?php if ($view->containsModules('copyright')): ?>
    137.   <?php echo $view->position('copyright', 'nostyle'); ?>
    138.   <?php else: ?>
    139.     <?php ob_start(); ?>
    140. <p><a href="http://elschems.ru">elschems</a></p><p>Copyright © %YEAR%. All Rights Reserved.</p>
    141.  
    142.     <?php echo str_replace('%YEAR%', date('Y'), ob_get_clean()); ?>
    143.   <?php endif; ?>
    144.         </div>
    145.         <div class="cleared"></div>
    146.     </div>
    147. </div>
    148.  
    149.         <div class="cleared"></div>
    150.     </div>
    151. </div>
    152. <div class="cleared"></div>
    153. <p class="page-footer"><a href="http://malorechka.org">malorechka.org ©</a>.</p>
    154. </div>
    155.     </div>
    156. </div>
    157.  
    158. <?php echo $view->position('debug'); ?>
    159. </body>
    160. </html>

    куда вставить <img src="адрес-большой-картинки" align="right/center/left">
    css вроде сделал
     
  5. Offline

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

    Регистрация:
    13.03.2010
    Сообщения:
    452
    Симпатии:
    18
    Пол:
    Женский
    Чтобы шапка была резиновой и менялась плавно и на разных разрешениях экрана смотрелась хорошо, можно прикрутить jquerly.
    http://ruseller.com/lessons.php?rub=32&id=1034
     
  6. shahin
    Offline

    shahin р-т

    Регистрация:
    22.04.2010
    Сообщения:
    437
    Симпатии:
    37
    Пол:
    Мужской
    templates/business/css/template.css -- строка 402
    templates/business/css/template.css -- строка 421
     
  7. samogon
    Offline

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

    Регистрация:
    29.10.2011
    Сообщения:
    4
    Симпатии:
    0
    Пол:
    Мужской
    Огромная при ОГРОМНАЯ просьба закавыряйте этот шаблон чтобы шапка 100% была http://us.ua/754905/
     
  8. Offline

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

    Регистрация:
    19.04.2012
    Сообщения:
    1
    Симпатии:
    0
    Пол:
    Мужской
    сделай тупо <div> под шапку и выравнивай в css сколько влезет
    можешь шапку вообще в таблицу засунуть :3
     
  9. samogon
    Offline

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

    Регистрация:
    29.10.2011
    Сообщения:
    4
    Симпатии:
    0
    Пол:
    Мужской
    я нуб троможу по страшному
    может кто сделает не могу воткнуть как а я потом повтыкаю и сравню соригиналом
     

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

Загрузка...