Лого - Шапка...

автор gez007 Сентябрь 25th 2014, 20:43

А такую штуку вместо шапки реально приклеить [Вы должны быть зарегистрированы и подключены, чтобы видеть эту ссылку]

Код:: <object type="application/x-shockwave-flash" height="300" width="990" data="http://agitki.ru/_ld/13/1319_J5w.swf"><param name="movie" value="http://agitki.ru/_ld/13/1319_J5w.swf" /><param name="wmode" value="transparent" /><param name="flashvars" value="&in_title=Ваш текст&&Video_url=http://www.youtube.com/v/VIDEO?version=2;autoplay=1;loop=1&" /></object>

автор gez007 Сентябрь 29th 2014, 16:43

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

Поскольку gif-анимация угробит качество фоновой картинки и сделает ее тяжелой, перелагаю собрать шапку из частей и анимировать средствами CSS.

1) В шаблоне overall_header (Верхняя часть страницы)
замените строку

Код:: <a href="{U_INDEX}" id="logo"><img src="{LOGO}" alt="{L_INDEX}" /></a>

на

Код:: <div id="logoblock"> <div class="logofon"></div> <div class="logopriv"><a href="{U_INDEX}"><img src="http://i39.servimg.com/u/f39/17/37/83/89/podvoh10.png" alt="" title="Добро пожаловать на форум" /></a></div> <div class="loropodvoh"></div> </div>

Сохраните и опубликуйте (!) измененный шаблон.

2) В CSS добавьте настройки с картинками и анимацией:

Код:: /* анимация шапки - общий фон */ div#logoblock { background: transparent url(http://i39.servimg.com/u/f39/17/37/83/89/fon0110.jpg) no-repeat center; height: 300px; width: 700px; margin: 0 auto; padding: 0; position: relative; } /* анимация шапки - второй фон */ .logofon { background: transparent url(http://i39.servimg.com/u/f39/17/37/83/89/fon0210.jpg) no-repeat center; height: 300px; width: 700px; margin: 0 auto; padding: 0; position: absolute; } /* анимация смены фона шапки */ .logofon { -moz-animation:logomove 8s ease infinite; -webkit-animation:logomove 8s ease infinite; animation:logomove 8s ease infinite; } @keyframes logomove { 0% {opacity:0} 50% {opacity:1.0} 100% {opacity:0} } @-webkit-keyframes logomove { 0% {opacity:0} 50% {opacity:1.0} 100% {opacity:0} } @-moz-keyframes logomove { 0% {opacity:0} 50% {opacity:1.0} 100% {opacity:0} } /* шапка - круг с приветствием */ .logopriv { height: 300px; width: 300px; position: absolute; left: 0; } /* шапка - подвох справа */ .loropodvoh { background: transparent url(http://i39.servimg.com/u/f39/19/00/80/99/310.gif) no-repeat center; height: 131px; width: 144px; position: absolute; right: 0px; margin-top: 100px; }

Пример того, что должно получиться: [Вы должны быть зарегистрированы и подключены, чтобы видеть эту ссылку]

автор gez007 Сентябрь 30th 2014, 10:14

Dana Domirani, я пока не увидел всей картины не представлял как она будет выглядеть, а выглядит она ужасно, нет никакой гармонии, каждый рисунок живёт по отдельности...Может без мультяшного подвоха всё бы ничего - он там ни к месту...А такую штуку вместо шапки реально приклеить [Вы должны быть зарегистрированы и подключены, чтобы видеть эту ссылку]

Код:: <object type="application/x-shockwave-flash" height="300" width="990" data="http://agitki.ru/_ld/13/1319_J5w.swf"><param name="movie" value="http://agitki.ru/_ld/13/1319_J5w.swf" /><param name="wmode" value="transparent" /><param name="flashvars" value="&in_title=Ваш текст&&Video_url=http://www.youtube.com/v/VIDEO?version=2;autoplay=1;loop=1&" /></object>

Лого - Шапка...

Лого - Шапка...

Re: Лого - Шапка...

Шапка - лого

Re: Лого - Шапка...