0 Пользователей и 1 Гость просматривают эту тему.
  • 89 Ответов
  • 134875 Просмотров
*

Skiminok

  • Осваиваюсь на форуме
  • 43
  • 0 / 0
  • Всё что ни делается, всё к лучшему!
? поставь скрипт или найди без картинок, 8 картинок, то тоже, если я захочу еще 4 колеса поставить себе на машину, чтоб она ехала быстрее, не думаю, что от 8 картинок веса меньше

немного несогласен насчет веса. где 8 картинок 40 кв весят или где 4 картинки 400 кв. по моему разница небольшая есть.
*

sc@r@bey

  • Захожу иногда
  • 360
  • 55 / 5
  • делай, а потом спрашивай что не получилось!
а что это за картинки такие у тебя? неоптимизированные, просто весь мир пользуется этим методом и не жалуется, если предложешь новое, будет здорово, только представь сколько кода придется добавить на 8 картинок?
*

Skiminok

  • Осваиваюсь на форуме
  • 43
  • 0 / 0
  • Всё что ни делается, всё к лучшему!
а что это за картинки такие у тебя? неоптимизированные, просто весь мир пользуется этим методом и не жалуется, если предложешь новое, будет здорово, только представь сколько кода придется добавить на 8 картинок?

Мне кажется что было-бы лучше делать 8 картинках чуть больше кода, зато страничка грузится быстрее. но мне кажется такое не скоро появится. думаю надо закрывать этот вопрос.

у меня есть еще 1 вопрос.
как сделать закругленные углы в MainBody на каждую новость отдельно? не меняя код jomla, а средствами css
*

sc@r@bey

  • Захожу иногда
  • 360
  • 55 / 5
  • делай, а потом спрашивай что не получилось!
не просто не надо создавать графику по 400 кБайт  ;D
под этот вопрос новую тему создаешь для начала
*

JeФoks

  • Новичок
  • 8
  • 0 / 0
Вот имеется код для углов без изображний:
css:
Код
.r1, .r2, .r3 {
    display: block;
    height: 1px;
    overflow: hidden;
    font-size:1px;
    padding-left: 5px;
    padding-right: 5px;
}

.r3 { margin: 0 12px;}
.r2 { margin: 0 11px;}
.r1 { margin: 0 10px;}

#rounded-box-3 .inner-box, #rounded-box-3  b {
    background-color: #d4e2e4;
}

.inner-box {
    padding:1em;
    magrin-left: 9px;
}
и в php:
Код
<div id="rounded-box-3">
    <b class="r3"></b><b class="r1"></b><b class="r1"></b>
    <div class="inner-box"><center>
<?php mosLoadModules ('left', -3); ?></center>
</div>
    <b class="r1"></b><b class="r1"></b><b class="r3"></b>
</div>
В итоге получаю, что самый верхний слой не хочет уменьшаться по горизонтали... Пытался описывать его и в "#rounded-box-3 .inner-box, #rounded-box-3  b" и в ".inner-box"

[вложение удалено Администратором]
*

sc@r@bey

  • Захожу иногда
  • 360
  • 55 / 5
  • делай, а потом спрашивай что не получилось!
а можно интегрировать JQuery plugin - jQuery Corner
*

DWolf

  • Захожу иногда
  • 75
  • 21 / 0
Читал этот топик и по нему делал закругленные углы у модуля.... Блин, ну нифига не получалось - потому что за сгруглениями у меня нет фона (прозрачность)..... в результате поправил код до такого вида:
Код
div.module {
margin: 10px 8px 0px 15px;
width: 186px;
background: url(../images/mod_top.gif) top left no-repeat;
}

div.module div {
background: url(../images/mod_bot.gif) bottom left no-repeat;
padding-bottom: 13px; /* Высота нижней картинки */
padding-top: 14px; /* Высота верхней картинки */

}

div.module div div {
background: url(../images/mod_mid.gif) repeat-y;
padding: 0px 10px 0px 10px;   

}

div.module div div div {
background: url(../images/px.gif) no-repeat;
padding: 0;
width: auto !important;
width: 100%;
}

div.module div div div h3 {
display: block; 
padding : 0px 0px 10px 0px; 
margin : 0;
font-family      : Arial, Verdana;
font-size        : 12px;
font-weight      : bold;
color            : #527a33;
text-transform   : uppercase;
text-align       : center;
letter-spacing   : 1px;
}

С таким вариантом кода у меня работала прозрачность за скругленностью.
*

dimon_sh84

  • Новичок
  • 3
  • 0 / 0
А я вот пользуюсь таким способом для joomla 1.5 (переделал как в GMail). Его преимущество в том, что всего 1 изображение (притом 1px) да еще и прозрачным можно + произвольный ("резиновый") размер блока:

В modules.php (..templates\system\html) находим функцию function modChrome_rounded и заменяем на:

 <?php
  function modChrome_rounded($module, &$params, &$attribs)
   { ?>
      <div class="module<?php echo $params->get('moduleclass_sfx'); ?>">
        <b class="r5"></b><b class="r3"></b><b class="r2"></b><b class="r1"></b><b class="r1"></b>
     <div class="inner-box">                  
       <?php if ($module->showtitle != 0) : ?>
         <h3><?php echo $module->title; ?></h3>
       <?php endif; ?>
       <?php echo $module->content; ?>
     </div>
   <b class="r1"></b><b class="r1"></b><b class="r2"></b><b class="r3"></b><b class="r5"></b>
      </div>
<?php
   }

В файл *.css (modules.css или template.css у кого как) вставляем:

/* ##################### MODULE ROUNDED STYLE #################*/
/* Element    |Class             |Suffix                                        */
/* div      |module           | moduleclass_sfx                         */
/* h3       |module           |
/* <jdoc:include type="modules" name="left" style="rounded" /> */

/* Module Content Control*/
div.module {}

/* Font Control */

/* Title Control */
div.module h3 {
  font-size :16px;
  color      :#000000;
}

/* List Control */
.module ul {}
.module li {}

/* Link Control*/
.module a:link{}
.module a:visited {}
.module a:hover {}
.module a:active {}

 /* Round Conners example */
.inner-box {
  padding:1px;
}
 
.r1, .r2, .r3, .r4, .r5, .r6, .r7, .r8, .r9, .r10 {
   display: block;
   height: 1px;
   overflow: hidden;
}
 
.r10 { margin: 0 10px; }
.r9 { margin: 0 9px; }
.r8 { margin: 0 8px; }
.r7 { margin: 0 7px; }
.r6 { margin: 0 6px; }
.r5 { margin: 0 5px; }
.r4 { margin: 0 4px; }
.r3 { margin: 0 3px; }
.r2 { margin: 0 2px; }
.r1 { margin: 0 1px; }

#rounded-box-3, .module, #rounded-box-10 { margin:7px; }    #rounded-box-5 заменен на .module

 
.inner-box, b { background-image: url(../images/1px.png); }    ЗДЕСЬ ИЗОБРАЖЕНИЕ В 1px. МОЖНО ПРОЗРАЧНОЕ!!!
 
/* уменьшаем отступы по мере роста радиуса закругления */
#rounded-box-3 .inner-box { padding: 1em;}
.module .inner-box { padding: 0.7em 1em;}                           #rounded-box-5 заменен на .module
#rounded-box-10 .inner-box { padding: 0.4em 1em;}


Из этого видно, что я использовал углы с радиусом 5. Можно сделать и 3 и 10 (да какой угодно радиус). Не забудьте только изменить modules.php для других радиусов. Например для r=10:

<?php
function modChrome_rounded($module, &$params, &$attribs)
{ ?>
   <div class="module<?php echo $params->get('moduleclass_sfx'); ?>">
    <b class="r10"></b><b class="r7"></b><b class="r5"></b><b class="r4"></b><b class="r3"></b><b class="r2"></b><b class="r2"></b><b class="r1"></b><b class="r1"></b><b class="r1"></b>
          <div class="inner-box">                  
           <?php if ($module->showtitle != 0) : ?>
             <h3><?php echo $module->title; ?></h3>
           <?php endif; ?>
           <?php echo $module->content; ?>
          </div>
      <b class="r1"></b><b class="r1"></b><b class="r1"></b><b class="r2"></b><b class="r2"></b><b class="r3"></b><b class="r4"></b><b class="r5"></b><b class="r7"></b><b class="r10"></b>
      </div>
   <?php
}

ну и конечно править css для нужного радиуса.

*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
на самом деле это ужасный способ, так как имеет тонну пустых тегов.
Гуглу это можно, а нам, простым смертным, нельзя такое делать
*

dimon_sh84

  • Новичок
  • 3
  • 0 / 0
ну для меня только этот метод подошел. хоть и перечитал множество. так что решать вам... Зато явная экономия на размере картинки.

Кстати, были проблемы с совместимостью браузеров. Так что, кого заинтересует - пишите.
« Последнее редактирование: 12.02.2009, 20:18:40 от dimon_sh84 »

эх,че то не получается..

сделал так
Код
		<td width="35%" align="top" height="100%" rowspan="7">
<jdoc:include type="modules" name="left" style="-3" />
</td>

то что в первом посте скопировал в темплейт.ксс

подключил ксс
Код
<link rel="stylesheet" href="/templates/myshab/css/template.css" type="text/css" />

Почему оно не скругляет ? даже дивы не создает...
« Последнее редактирование: 25.03.2009, 15:32:46 от MaxePlank »
*

poizon

  • Захожу иногда
  • 495
  • 187 / 1
  • Buu
ну как бы у Вас Joomla 1.5, а данный код для версий 1.0.x
*

fatalerror

  • Захожу иногда
  • 444
  • 48 / 2
  • Уполномоченный по правам чайников
В начале топика есть ссылка

....

3. Описание техники создания круглых углов без картинок.
...

Но та ссылка ведет на буржуйский ресурс на буржуйском языке.

Нашел в сети на русском.

_http://www.lobachev.ru/2007/sglazhennye-zakruglennye-ugly-bez-ispolzovaniya-izobrazhenij/

Тоже без картинок рамка делается. Вот только не пойму, как это дело на модули переложить. Чтобы, значит, суффикс к модулю добавить, и круглая рамка получалась.

Может, кому полезно будет.
Расстреляно форумчан за нецензурщину: 1 (один).  Дерьмо случается...
*

timonnn

  • Захожу иногда
  • 366
  • 15 / 0
А как сделать такие углы для линейки 1.5???
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
Почему оно не скругляет ? даже дивы не создает...

потомоу что
<jdoc:include type="modules" name="left" style="-3" />                  
цифровые индексы в 1.5 НЕ работают.
Как правильно задавать вопрос службе технической поддержки  yes!
SGA CM 7.2.0 RC0 KANG Build GWK74 + s95allinonescript + CWM 5.0.2.6 + Modem XWKT3
*

PaLyCH

  • Давно я тут
  • 948
  • 146 / 19
  • Архитектор сайтов
Все тоже самое, ничего не изменилось практически
*

userxp

  • Живу я здесь
  • 2019
  • 403 / 6
  • Злой и ужасный бармалей
*

PaLyCH

  • Давно я тут
  • 948
  • 146 / 19
  • Архитектор сайтов
Пишем вместо <jdoc:include type="modules" name="left" style="-3" />      
Вот так <jdoc:include type="modules" name="left" style="rounded" />      
*

nikolaos

  • Осваиваюсь на форуме
  • 27
  • 2 / 0
Столкнулся с такой проблемой уже как не пытался решить, не вышло даже разобрал радуги шаблон у него пашет а у меня нет  ^-^, пример: в index.php пишу <jdoc:include type="modules" name="left" style="test" /> задаю модулю свой стиль, в ксс задаю стиль модулю div.test{} div.test div{} и так далее в итоге по идее должно быть результативно модуль с  закругленными углами, но не тут то было. rounded не могу назвать стиль как уже имееться такой, а нужно модуль например в другом месте другого цвета. Буду очень благодарен если кто нить мне объяснит что не так, и почему не работает.
*

PaLyCH

  • Давно я тут
  • 948
  • 146 / 19
  • Архитектор сайтов
Столкнулся с такой проблемой уже как не пытался решить, не вышло даже разобрал радуги шаблон у него пашет а у меня нет  ^-^, пример: в index.php пишу <jdoc:include type="modules" name="left" style="test" /> задаю модулю свой стиль, в ксс задаю стиль модулю div.test{} div.test div{} и так далее в итоге по идее должно быть результативно модуль с  закругленными углами, но не тут то было. rounded не могу назвать стиль как уже имееться такой, а нужно модуль например в другом месте другого цвета. Буду очень благодарен если кто нить мне объяснит что не так, и почему не работает.
Ты не много путаешь, тут другая шаблонизация. по смотри по ссылке
« Последнее редактирование: 11.06.2009, 23:48:24 от userxp »
*

nikolaos

  • Осваиваюсь на форуме
  • 27
  • 2 / 0
Цитировать
Ты не много путаешь, тут другая шаблонизация. по смотри по ссылке
немного не туда, теперь увидел что 1,0 а не 1,5 но делаю я кокраз закругленные углы и получились с первого раза, на 1,5 поставить да и темка создана Радугой он в своем одном шаблоне кокраз использовал ззакругленные углы таким способом задания стилей вот и думаю может пожет кто.
*

faraon_x

  • Захожу иногда
  • 362
  • 27 / 1
  • Чем смогу, тем помогу )))
Попробовал метод и вот, что получилось!? Центр репититься на всю высоту!
Код
#right24 div.module_license {
  width: 180px;
  background: url(../images/license_2.png) repeat-y;
  margin-bottom: 15px;
}

#right24 div.module_license div {
  background: url(../images/license_3.png) bottom left no-repeat;
}

#right24 div.module_license div div {
  background: url(../images/license_1.png) top left no-repeat;
  padding: 10px 10px 20px 10px;
  
}
#right24 div.module_license div div div {
  background: none;
  padding: 0;
  width: auto !important;
  width: 100%;
}
Фрагменты приложены

[вложение удалено Администратором]
Вопросы по JFORMS, можно ещё попробовать задать здесь
Российский 3d сканер от разработчиков и производителей
*

faraon_x

  • Захожу иногда
  • 362
  • 27 / 1
  • Чем смогу, тем помогу )))
Как понимаю проблема с отступами блока с репитом, но задание padding top и bottom, не решают проблемы. кто может сталкивался?
Вопросы по JFORMS, можно ещё попробовать задать здесь
Российский 3d сканер от разработчиков и производителей
*

PaLyCH

  • Давно я тут
  • 948
  • 146 / 19
  • Архитектор сайтов
Проблема в том, что ПНГ с круглениями имеют прозрачность, в нижние слои кладешь их, потом делаешь паддинг для внутреннего
Код: css
#right24 div.module_license {
  width: 180px;
  background: url(../images/license_1.png) top left no-repeat;
  margin-bottom: 15px;
}

#right24 div.module_license div {
  background: url(../images/license_3.png) bottom left no-repeat;
  padding:10px 0 20px 0
}

#right24 div.module_license div div {
  background: url(../images/license_2.png) repeat-y;
  padding: 0 10px 0 10px;
 
}
#right24 div.module_license div div div {
  background: none;
  padding: 0;
  width: auto !important;
  width: 100%;
}
*

faraon_x

  • Захожу иногда
  • 362
  • 27 / 1
  • Чем смогу, тем помогу )))
точно, получилось. +1
Вопросы по JFORMS, можно ещё попробовать задать здесь
Российский 3d сканер от разработчиков и производителей
*

Bogdan808

  • Захожу иногда
  • 89
  • 2 / 1
Японский сарай... не знаю чем там думал джум разработчики, но по моему это один из самых голимых методов. Не считая того что валидатор ругается когда проводит сканирование, еще и багов куча!
Проще задать каждому вложеному диву id и делать обращение прямо ему
 
Код
#right24 div.module_license div div div
*

redaktor.lvivske.info

  • Осваиваюсь на форуме
  • 15
  • 0 / 1
Sorry. Не знаю как удалить. Смотрите ниже.
« Последнее редактирование: 17.11.2011, 00:39:20 от redaktor.lvivske.info »
*

redaktor.lvivske.info

  • Осваиваюсь на форуме
  • 15
  • 0 / 1
Поздновато пишу (только сейчас увидел эту тему), но судя по тому, что на Портативе до сих пор нет ни одного javascript-закруглённого уголка, то тема продолжает быть актуальна. Возможно, я могу подсказать, как сделать закруглённые уголки БЕЗ картинок применительно к Joomla.

1. В директории с используемым шаблоном создаём новую папку. Называем её, допустим, "corners";
2. Скачиваем прилагаемый архив, распаковываем, полученные 3 файла помещаем в созданную папку;
3. Подключаем новые файлы поместив в index.php шаблона между тэгами "head" следующие строки:
Код
<link rel="stylesheet" type="text/css" href="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/corners/niftyCorners.css">
<link rel="stylesheet" type="text/css" href="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/corners/niftyPrint.css" media="print">
<script type="text/javascript" src="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/corners/nifty.js"></script>
4. Закругляем уголки любого используемого в CSS контейнера помещая опять же в index.php между тэгами "head" следующие строки:
Код
<script type="text/javascript">
window.onload=function(){
Rounded("div#user1","#000","#FFF");
}
</script>

Примечание:
- вместо "user1" подставляем название любого другого модуля или заголовка;
- если необходимо закруглить несколько модулей, дублируем строку Rounded("..."), перечисляя элементы;
- #000 - цвет внутреннего угла, #FFF - внешнего;
- если хотим закруглить только верх или низ модуля, используем RoundedTop или RoundedBottom;
- использовал этот метод только на шаблонах свёрстанных слоями - работает без проблем.

Отпишись потом, получилось добиться результат, или нет. Ну или можно "+" поставить, если заработает. :)


Делал всё как здесь только  в индексе переделал под Joomla 1.5.  Углы не получаются. Посмотрите пожалуйста, что не так?

index.php


<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->language; ?>" lang="<?php echo $this->language; ?>" >  
<head>  
<jdoc:include type="head" />  
<link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/santor/css/template.css"  />
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/santor/corners/niftyCorners.css">
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseurl ?>/templates/santor/corners/niftyPrint.css" media="print">
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/santor/corners/nifty.js"></script>
<script type="text/javascript">
window.onload=function(){
Rounded("div#right","#000","#FFF");
}
</script>
</head>
<body>
<div id="container"> <div id="container2">
<jdoc:include type="modules" name="mainmenu" style="raw" />
    <jdoc:include type="modules" name="top" />
    <div id="content" class="float">    
   <jdoc:include type="component" /></div>          
    <div id="sidebar_right"class="float_right"><jdoc:include type="modules" name="right" style="rounded" /></div>  
    <div id="footer" class="clear"><jdoc:include type="modules" name="footer" /></div>  
</div>
</div>
</body>  
</html>
*

redaktor.lvivske.info

  • Осваиваюсь на форуме
  • 15
  • 0 / 1
Ау-у. Кто нибудь, хоть что-нибудь скажет. Или зачем этот форум вообще?!
*

den_caruk

  • Захожу иногда
  • 64
  • 2 / 0
Все работает, просто подключайте модули <jdoc:include type="modules" name="left" style="rounded" />  и обязательно прописывайте style="rounded", именно тогда движок сгенерирует эти три DIV'а
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как сделать показ header от времени суток

Автор raduga

Ответов: 33
Просмотров: 36038
Последний ответ 19.01.2014, 01:35:26
от Beer
Как сделать, чтобы контактная информация отображалась над меню или рядом с ним?

Автор bugaooga

Ответов: 1
Просмотров: 3528
Последний ответ 25.10.2013, 20:54:31
от artel-st
Как сделать чтобы определенный модуль был только на одной странице

Автор alexS

Ответов: 25
Просмотров: 18880
Последний ответ 05.06.2013, 00:46:16
от puserfill
Как сделать смену картинки при выборе разных пунктах меню

Автор raduga

Ответов: 17
Просмотров: 24757
Последний ответ 16.01.2013, 14:19:27
от zavarov
Как сделать поля/отступы для изображений в контенте?

Автор Andrew

Ответов: 6
Просмотров: 9887
Последний ответ 22.07.2012, 22:08:49
от Taatshi