Продолжение темы Общие вопросы по оформлению (37)
Отредактировано Deff (Вс, 6 Ноя 2011 18:49:15)
Общие вопросы по оформлению (38)
Сообщений 1 страница 20 из 1000
Поделиться1Вс, 6 Ноя 2011 18:47:17
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Поделиться2Вс, 6 Ноя 2011 18:54:02
Deff, Здравствуйте ещё раз. Собственно вот:
Мне нужно эту шапку на форуме подвинуть вниз. Так же я хотел над шапкой вверху сделать такую же линию-границу, как по бокам, ибо она "врезается" в верх браузера. В прошлом посте мне посоветовали сделать эту границу прямо на шапке, как бы я хотел видеть.
Но сейчас подумав что из всего этого получится, пришёл к выводу что перемещение шапки к основному меню (форум, участники, поиск...) и эта линия вверху создадут 2 проблемы визуального характера:
1. Линии-границы после перемещения шапки вниз как бы "заедут" наверх.
2. В верхних углах шапки между этими линиями будет нестыковка (чёткого перехода нет).
Что-то вроде этого:
Так же подумав я нашёл решение. Можно схитрить ещё раз. После сдвига шапки вниз, верхнее свободное пространство с заехавшими линиями "закрыть" монотонной картинкой, с цветом заднего фона. По центру картинки можно разместить картинки или узоры, чтобы дополняло картинку, и место было не таким пустым. Эту "заплатку" поставить так чтобы она растягивалась\сужалась вместе с шапкой, сайтом, и т.п., дабы не "спалиться". А нестыковки в углах можно закрыть двумя картинками поверх полоски-заплаты, и из них сделать ссылки.
Примерно вот так:
Полоска: 
Картинка 1: 
Картинка 2: 
Был бы рад помощи 
Поделиться3Вс, 6 Ноя 2011 18:54:40
Кратко не вышло... 
http://endless.topbb.ru/
Отредактировано Mystical (Вс, 6 Ноя 2011 18:55:11)
Поделиться4Вс, 6 Ноя 2011 19:40:53
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Mystical Не буду ковыряцо с обрезками - сделайте красивый итоговый вариант шапки вместе закраинами в натуральную величину(для этого работайте в ФШ по скриншоту форума) такого плана
http://savepic.su/627454.jpg , её целиком и поставим
Поделиться5Вс, 6 Ноя 2011 19:50:31
Ок, сделаю. Дело в том что я хотел эти значки (по углам - Forsaken & Perfect World) сделать ссылками на что-нибудь. А если сделать из всего этого сплошную картинку-шапку, задуманное ведь не получится сделать?...
Поделиться6Вс, 6 Ноя 2011 20:01:17
http://psy.mybb.ru/
Подскажите как убрать подчеркивание с ссылок и какие параметры нужно ввести чтобы рекламу подвинуть туда, где логотип?
И как логотип заменить, но оставить такую же структуру? В сущности, как сохранить картинку логотипа, чтобы переделать ее и вставить обратно?
Поделиться7Вс, 6 Ноя 2011 20:07:42
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Francemoon написал(а):
http://psy.mybb.ru/Подскажите как убрать подчеркивание с ссылок
Общие вопросы по оформлению (37) пост 998
Francemoon написал(а):
какие параметры нужно ввести чтобы рекламу подвинуть туда, где логотип?
Типовые Вопросы п.п.8
Отредактировано Deff (Вс, 6 Ноя 2011 20:09:37)
Поделиться8Вс, 6 Ноя 2011 20:08:27
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Mystical написал(а):
Ок, сделаю. Дело в том что я хотел эти значки (по углам - Forsaken & Perfect World) сделать ссылками на что-нибудь. А если сделать из всего этого сплошную картинку-шапку, задуманное ведь не получится сделать?...
По идее - Просто переоцифровать Вашу мап карту под новую картинку
Поделиться9Вс, 6 Ноя 2011 20:23:46
Да, вы правы...
Если я правильно вас понял по поводу шапки - вот: 
Отредактировано Mystical (Вс, 6 Ноя 2011 20:23:58)
Поделиться10Вс, 6 Ноя 2011 20:48:51
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Mystical написал(а):
Если я правильно вас понял по поводу шапки - вот:
Пробуйте поменять код карты на такой
Код:
<img src="http://s58.radikal.ru/i162/1111/13/92e48ea0ae67.jpg" width="921" height=444" border="0" style="margin:0 62px -89px -62px;" usemap="#Map" /> <map name="Map" id="Map"> <area shape="poly" coords="53,32,53,32,139,14,141,20,151,71,150,71,71,91" href="#ссылка" alt="о нас" /> <area shape="poly" coords="181,19,181,17,260,29,253,82,216,84,190,80,175,74,176,66,173,48,176,61" href="#ссылка" alt="устав" /> <area shape="poly" coords="303,20,388,5,399,65,348,72,309,79" href="#ссылка" alt="Вступить" /> <area shape="poly" coords="445,10,540,29,523,92,474,88,435,76" href="#ссылка" alt="Forsaken world" /> <area shape="poly" coords="582,22,676,5,688,75,591,91" href="#ссылка" alt="Perfect world" /> </map>
Оцифровку замените сами или попросите в заказах МАП карт
Поделиться11Вс, 6 Ноя 2011 21:27:35
Здорово, спасибо!
А подрихтовать это можно как-то?
Поделиться12Вс, 6 Ноя 2011 21:51:05
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Mystical написал(а):
А подрихтовать это можно как-то?
Поставьте в HTML верх такое
<style type="text/css">
#pun-title {
border:0 none transparent;
}
</style>
Если обводка всёж нужна - сделайте её на картинке
Поделиться13Вс, 6 Ноя 2011 21:56:12
Спасибо ещё раз!
Поделиться14Пн, 7 Ноя 2011 00:25:41
- Заслуженный
- Зарегистрирован: Ср, 20 Июл 2011
- Сообщений: 149
- Уважение: +4
- Позитив: +17
- Пол: Женский
- Последний визит:
Вс, 17 Ноя 2013 03:36:48
Помогите, пожалуйста, настроить это меню так, чтобы основные пункты отображались посередине, а все выплывающие в списках - по левому краю. Вот так:
В опере и в хроме все шоколадно, а вот в эксплорере это выглядит так:
В мозилле все ссылки определяются по центру:
Код:
<center><div id="menu">
<ul id="nav"; align="left">
<li class="top"><a href=" " class="top_link"><span class="down"><img src="http://forumstatic.ru/files/000f/6b/c8/88979.png"></span></a>
<ul class="sub">
<li><a href="http://thedas.ru/viewforum.php?id=3" class="fly">Гостевая</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=185">Вопросы гостей</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=263">Ищем персонал</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=258">Как влиться в игру?</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=165">Состав администрации</a></li>
</ul>
</li>
<li><a href=" " class="fly">Правила</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=27">Правила форума</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=257">Об игре</a></li>
</ul>
</li>
<li><a href=" " class="fly">Знакомство с игрой</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=99">Хронология событий</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=228">Сюжет</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=254#p2813">Кто есть кто</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=218">Требуемые персонажи</a></li>
</ul>
</li>
<li><a href="http://thedas.ru/viewforum.php?id=6" class="fly">Создание персонажа</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=27#p1087">Оформление профиля</a></li>
<li><a href="" class="fly">Выбор аватара</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=319">Заказ аватара</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=266">Мужские аватары</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=267">Женские аватары</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=346">Прочие аватары</a></li>
</ul>
</li>
<li><a href="" class="fly">Шаблоны анкет</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=16#p24">Для канона</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=13#p18">Для неканона</a></li>
</ul>
</li>
</li>
</ul>
</li>
</ul>
</li>
<li class="top"><a href=" " class="top_link"><span class="down"><img src="http://forumstatic.ru/files/000f/6b/c8/97451.png"></span></a>
<ul class="sub">
<li><a href="http://thedas.ru/viewforum.php?id=2" class="fly">Технические моменты</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=243#p2509">Архив обновлений</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=153">Объявления администрации</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=329">Вопросы, предложения</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=330">Создание игровых локаций</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=302">Поиск партнера по игре</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=149">Уход/Отсутствие</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=331">Возвращение в игру</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=164">Смена полномочий</a></li>
<li><a href=" " class="fly">Поощрения</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=105">Награды</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=341">Доска Почета</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=340">Черная Доска</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="http://thedas.ru/viewforum.php?id=36">Обсуждения</a></li>
<li><a href="http://thedas.ru/viewforum.php?id=25" class="fly">Игромеханика</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=269">События</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=180">Отношения</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=179">Время и погода</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=348">НПС</a></li>
</ul>
</li>
</ul>
</li>
<li class="top"><a href=" " class="top_link"><span class="down"><img src="http://forumstatic.ru/files/000f/6b/c8/12984.png"></span></a>
<ul class="sub">
<li><a href="http://thedas.ru/viewforum.php?id=8" class="fly">Кодекс</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=304">Заметки</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=64">Книги и песни</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=305">Комбинации</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=298">Культура и история</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=294">Магия и религия</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=300">Персонажи</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=293">Предметы</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=306">Связанное с заданием</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=19">Существа</a></li>
</ul>
</li>
<li><a href="http://thedas.ru/viewforum.php?id=10" class="fly">Все о Тедасе</a>
<ul>
<li><a href="" class="fly">Боевое искусство</a>
<ul>
<li><a href=" ">Навыки</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=167">Умения и заклинания</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=256">Воин</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=222">Разбойник</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=155">Маг</a></li>
</ul>
</li>
<li><a href="" class="fly">География</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=260">Карты</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=193">Время и расстояние</a></li>
</ul>
</li>
<li><a href="" class="fly">Летоисчисление</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=72">Календарь Тедаса</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=24">Летопись Тедаса</a></li>
</ul>
</li>
<li><a href="" class="fly">Расы</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=247">Расы (общее описание)</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=93">Кунари</a></li>
<li><a href=" ">Люди</a></li>
<li><a href=" ">Гномы</a></li>
<li><a href=" ">Эльфы</a></li>
</ul>
</li>
<li><a href="" class="fly">Религии</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=63">Древние боги Империи</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=56">Церковь</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=94">Кун</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=106">Эльфийский Пантеон</a></li>
</ul>
</li>
<li><a href="" class="fly">Языки</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=107">Эльфийский</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=95">Кунарийский</a></li>
</ul>
</li>
<li><a href="" class="fly">Общество</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=345">Организации</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=32">Круг Магов</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=55">Орден Храмовников</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=25">Орден Серых Стражей</a></li>
</ul>
</li>
</ul>
</li>
</ul>
</li>
<li class="top"><a href=" " class="top_link"><span class="down"><img src="http://forumstatic.ru/files/000f/6b/c8/53711.png"></span></a>
<ul class="sub">
<li><a href="http://thedas.ru/viewforum.php?id=38" class="fly">Реклама</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=229">Код нашей рекламы</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=232">Баннерообмен</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=230">Реклама от Вас</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=231">Реклама от нас</a></li>
</ul>
</li>
<li><a href="http://thedas.ru/viewforum.php?id=21" class="fly">Полезности</a>
<ul>
<li><a href="http://thedas.ru/viewtopic.php?id=288">Полезные сайты</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=223">Консоль в DA:O</a></li>
<li><a href="http://thedas.ru/viewtopic.php?id=212">Украшаем форум</a></li>
</ul>
</li>
<li><a href="http://thedas.ru/viewforum.php?id=4">За кружечкой эля</a></li>
<li><a href="http://thedas.ru/viewforum.php?id=5">Беседка</a></li>
<li><a href="http://thedas.ru/viewforum.php?id=23">Наше творчество</a></li>
</ul>
</li>
</ul>
</div>
</center>Код:
/* E1 infomenu
-------------------------------------------------------------*/
#menu {width: 810px;}
#nav {padding:0; margin:0; list-style:none; height:35px; background-image: url( ); background-color: #e0ccb3; repeat-x; position:relative; z-index:500; font-family:arial, verdana, sans-serif; font-size:1.2em; font-weight: bold;}
#nav li.top {display:inline; float:left; height:38px;}
#nav li a.top_link {display:block; float:left; height:45px; line-height:33px; color:#000; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;}
#nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:45px}
#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:45px; background: url(http://i069.radikal.ru/0908/92/6c4d85925bb5.gif) no-repeat right top;}
#nav li:hover a.top_link,
#nav li.iehover a.top_link {color:#000; background: url() no-repeat; cursor:pointer;}
#nav li:hover a.top_link span,
#nav li.iehover a.top_link span {background:url() no-repeat right top; cursor:pointer;}
#nav li:hover a.top_link span.down,
#nav li.iehover a.top_link span.down {background:url() no-repeat right top; cursor:pointer;}
/* Default list styling */
#nav li:hover {position:relative; z-index:200; cursor:pointer;}
#nav li:hover ul.sub
{left:1px; top:38px; background: #EED8AE; padding:3px; border:1px solid #CDBA96; white-space:nowrap; width:170px; height:auto; z-index:300; cursor:pointer;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:160px; font-weight:normal; cursor:pointer;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:18px; width:170px; line-height:18px; text-indent:5px; color:#000; text-decoration:none;border:1px solid #d2b48c; cursor:pointer;}
#nav li ul.sub li a.fly
{background: #EED8AE url(http://i039.radikal.ru/0908/9e/497f4175123f.gif) 160px 6px no-repeat; cursor:pointer;}
#nav li:hover ul.sub li a:hover
{background-image: url( ); background:#d2b48c; color:#000; border-color:#a25f2a; cursor:pointer;}
#nav li:hover ul.sub li a.fly:hover
{background:#d2b48c url( ) 160px 6px no-repeat; color:#fff; cursor:pointer;}
#nav li:hover li:hover ul,
#nav li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover ul,
#nav li:hover li:hover li:hover li:hover li:hover ul
{left:165px; top:-4px; background: #EED8AE; padding:3px; border:1px solid #CDBA96; white-space:nowrap; width:170px; z-index:400; height:auto;}
#nav ul,
#nav li:hover ul ul,
#nav li:hover li:hover ul ul,
#nav li:hover li:hover li:hover ul ul,
#nav li:hover li:hover li:hover li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
#nav li:hover li:hover a.fly,
#nav li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover a.fly,
#nav li:hover li:hover li:hover li:hover li:hover a.fly
{background:#d2b48c url( ) 160px 6px no-repeat; color:#000; border-color:#a25f2a;}
#nav li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li a.fly,
#nav li:hover li:hover li:hover li:hover li a.fly
{background:#EED8AE url(http://i039.radikal.ru/0908/9e/497f4175123f.gif) 160px 6px no-repeat; color:#000; border-color:#d2b48c;}Помогите, пожалуйста, корректно выправить код на предмет кроссбраузерности.
Отредактировано Лирия (Пн, 7 Ноя 2011 00:28:22)
Поделиться15Пн, 7 Ноя 2011 00:28:29
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Лирия написал(а):
а вот в эксплорере это выглядит так:
В ИЕ у Вас просто отключен ява скрипт
Для "Левости"
Добавьте в HTML верх
<style>#nav ul li{
text-align:left!important;
}
</style>
Отредактировано Deff (Пн, 7 Ноя 2011 00:34:04)
Поделиться16Пн, 7 Ноя 2011 00:33:55
- Заслуженный
- Зарегистрирован: Ср, 20 Июл 2011
- Сообщений: 149
- Уважение: +4
- Позитив: +17
- Пол: Женский
- Последний визит:
Вс, 17 Ноя 2013 03:36:48
Deff написал(а):
В ИЕ у Вас просто отключен ява скрипт
Странно. Остальные скрипты в ИЕ отображаются, только меню в объявлении не робит.
Поделиться17Пн, 7 Ноя 2011 00:35:28
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Лирия написал(а):
Странно. Остальные скрипты в ИЕ отображаются, только меню в объявлении не робит.
Отредактировано Deff (Пн, 7 Ноя 2011 00:35:53)
Поделиться18Пн, 7 Ноя 2011 00:43:37
- Заслуженный
- Зарегистрирован: Ср, 20 Июл 2011
- Сообщений: 149
- Уважение: +4
- Позитив: +17
- Пол: Женский
- Последний визит:
Вс, 17 Ноя 2013 03:36:48
Deff написал(а):
http://savepic.su/650811.png
Это вроде режим совместимости... У меня ни в одном не отображается сайт корректно, а меню только в режиме стандартного ИЕ7 работает...
Поделиться19Пн, 7 Ноя 2011 00:45:20
- Тутошний...
- Зарегистрирован: Ср, 16 Июн 2010
- Сообщений: 51119
- Уважение: +15200
- Позитив: +11602
- Последний визит:
Сегодня 15:47:01
Лирия Там видно - что браузер - ИЕ
Поделиться20Пн, 7 Ноя 2011 00:50:46
- Заслуженный
- Зарегистрирован: Ср, 20 Июл 2011
- Сообщений: 149
- Уважение: +4
- Позитив: +17
- Пол: Женский
- Последний визит:
Вс, 17 Ноя 2013 03:36:48
Я ничего не понимаю...
А как меню отладить в других браузерах?
И у меня в ИЕ вообще и статистика и многое другое по центру отображается...
Отредактировано Лирия (Пн, 7 Ноя 2011 00:56:08)