Invisible Man сокращай отступы для первых пяти на 7 пиксел с обоих сторон
navindex
navuserlist
navextra1
navrules
navsearch
Отредактировано Deff (Вт, 14 Дек 2010 13:09:00)
Единый форум поддержки |
Привет, Гость! Войдите или зарегистрируйтесь.
Вы здесь » Единый форум поддержки » Корзина » Оформления меню навигации главных кнопок форума
Invisible Man сокращай отступы для первых пяти на 7 пиксел с обоих сторон
navindex
navuserlist
navextra1
navrules
navsearch
Отредактировано Deff (Вт, 14 Дек 2010 13:09:00)
не рабочая http://onserial-letay-16.ru/uploads/000 … 5012-2.gif
Вот так работает наш сервер (картинка есть и ссылка не битая..)
Для
navuserlist
navextra1
еще на 5 уменьшить(для navextra1 можно чуть больше
для navrules на 2 увелич с обеих
Отредактировано Deff (Вт, 14 Дек 2010 13:20:39)
Deff
Не меняца не че 
Invisible Man для > http://serialtop.topbb.ru/ Зачит ошибки :
1. я ж грил a:hover не трогай про padding
2. делай рисунки надписей сейчас влотную к левому боку,(может даж стоит их делать на прозрачке - поставил белый фон в меню
/* Свои иконки в навигации сss(ом) плюс доп иконки*/
/* ============================================== */
#pun-navlinks .container{
background-color: #fff !important;
height: 25px !important;
padding: 5px 0 16px 0 !important;
}
#pun-navlinks li {
background-color: transparent !important;
}
#pun-navlinks li a span {
font-size:0px!important;
visibility:hidden!important;
}
#pun-navlinks li a {
border-style: none !important;
padding-top: autopx!important;
padding-bottom: 30px !important;
margin: 0 -34px;
text-decoration: none;
}
#navindex a {
background: url(5010-100.png) no-repeat left center !important;
padding-right:120px !important;
}
#navuserlist a {
background: url(5011-100.png) no-repeat left center !important;
padding-right:129px !important;
}
#navrules a {
background: url(5013-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navrules a:hover {
background: url(5013-200.png) no-repeat left center !important;
}
#navsearch a {
background: url(5014-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navprofile a{
background: url(5015-100.png) no-repeat left center !important;
padding-right:100px !important;
}
#navpm a{
background: url(5016-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navadmin a{
background: url(5017-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navregister a{
background: url(5018-100.png) no-repeat left center !important;
padding-right:140px !important;
}
#navlogin a{
background: url(5019-100.png) no-repeat left center !important;
padding-right:160px !important;
}
#navlogout a{
background: url(5020-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navextra1 a{
background: url(5012-100.png) no-repeat left center !important;
padding-right:120px !important;
}
#navextra2 a{
background: url(4435-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navextra3 a{
background: url(4437-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navextra4 a{
background: url(4436-100.png) no-repeat left center !important;
padding-right:130px !important;
}
#navsearch a:hover {
background: url(5014-200.png) no-repeat left center !important;
}
#navuserlist a:hover {
background: url(5011-200.png) no-repeat left center !important;
}
#navindex a:hover {
background: url(5010-200.png) no-repeat left center !important;
}
#navprofile a:hover{
background: url(5015-200.png) no-repeat left center !important;
}
#navpm a:hover{
background: url(5016-200.png) no-repeat left center !important;
}
#navadmin a:hover{
background: url(5017-200.png) no-repeat left center !important;
}
#navregister a:hover{
background: url(5018-200.png) no-repeat left center !important;
}
#navlogin a:hover{
background: url(5019-200.png) no-repeat left center !important;
}
#navlogout a:hover{
background: url(5020-200.png) no-repeat left center !important;
}
#navextra1 a:hover{
background: url(5012-200.png) no-repeat left center !important;
}
#navextra2 a:hover{
background: url(4435-200.png) no-repeat left center !important;
}
#navextra3 a:hover{
background: url(4437-200.png) no-repeat left center !important;
}
#navextra4 a:hover{
background: url(4436-200.png) no-repeat left center !important;
}!Внимание -Ссылки поменяй в коде на свои ( у меня ссылки на картинки взяты с виртуалки
Отредактировано Deff (Вт, 14 Дек 2010 16:01:21)
Вот всё-таки, чем был хорош Яваскрипт-вариант, так это то, что не нужно было подгонять изображения под меню, ибо они добавлялись вовнутрь самих ссылок, а не фоном.
rps Cогласен, поэтому самый удобный компромисс отдельная табличка с меню с абсолютным позиционированием и со всякими выпадениями и прочее, плюс скрипт с тремя IF на группу пользователей -включающий(обычно для всех скрытые) дополнительные пункты меню
Deff
Спасибо. Поставил но не то все ровно... (надоел уже я чувствую)
rps
Думаю теперь согласится с вами...вернусь на исходную
Бывает что картинки не дозогружаются....
Invisible Man Сделай красивые кнопки для всех позиций -дай ссылки, - попробуем табличкой
(А для предыдущего равнял ток первые пять(остальные не видны гостю -те проще -цифра одна
и опять по предыдущему
1- выровняй шрифт по левому краю в картинках и обрежь (ну пиксел -два до буквы слево - справо не критично можь и пять и 10
2 - может шрифт имеет смысл на прозрачке - внизу фон белый поставил
<noscript> Тут скрипты </noscript>
Отредактировано Deff (Вт, 14 Дек 2010 21:57:06)
Deff
Ха даж теперь скриптом не получается..расстояние остается между ними... да и пока приживается что ли скрипт
показывает старые иконки, хотя в css их уже нет... А что за табличка, пример можешь дать? или была такая мысля вообще перенести эти кнопки в бокавую панель...
написал же что нет в css у мня не че, обманывать бы не стал...
Отредактировано Invisible Man (Вт, 14 Дек 2010 21:53:50)
Invisible Man да пофигу какая -хоть в боковую - как удобно так и поставим - главное кнопки прорисованные(до наведения и при) и эскиз как ставить примерно
да и пока приживается что ли скрипт показывает старые иконки, хотя в css их уже нет..
Эт кукисы и Историю чистит нужно - у мну аналогично - даж поперся проверять сss
Почистил -сраз перестало глючить
Отредактировано Deff (Вт, 14 Дек 2010 21:56:41)
лавное кнопки прорисованные(до наведения и при) и эскиз как ставить примерно
Хорошо Deff подумаю над этим...
А те кнопки с надписями не подойдут что ли?
или они ужасные.....
Отредактировано Invisible Man (Вт, 14 Дек 2010 21:57:28)
Invisible Man Просто в таблице можно всё украсивить и даже если в столбик в сайдбар засунуть
Да и кнопки могут быть посерьезней, - порыскать в гугле - может что понравится, - не, - если хочешь простые - пожалуйста (но они мало чем отличаются от исходных надписей - там просто шрифт и цвет поменять будет тоже самое
( просто даж текущие иконки симпатичней и в табличке они уже жацо не будут
Можно и с текущими
Отредактировано Deff (Вт, 14 Дек 2010 22:59:23)
и даже если в столбик в сайдбар засунуть
Что то типа этого.
Могут быть и посерьезней - порыскать в гугле - может что понравится,
Ну если честно простые которые я сделал как раз под фон категорий, чтоб уж в дизайн как то вписывались. Не спорю что которые сейчас стоят красивые, но очень уж как новогодняя елка не к селу не к городу...
но они мало чем отличаются от исходных надписей - там просто шрифт и цвет поменять будет тоже самое
Ну там не сделаешь чтоб менялся цвет был белый, при наведение серый...
Добавлено: Чтоб переливались, как на многих сайтах ....как бы строение форума мое чем то напоминает http://www.lostfilm.tv/ вот там у них прикольно сделано меню навигации...
Отредактировано Invisible Man (Вт, 14 Дек 2010 23:06:08)
Ну там не сделаешь чтоб менялся цвет был белый, при наведение серый...
Без проблем - это в ксс прописываецо background-color: к span элемента
http://www.lostfilm.tv/ вот там у них прикольно сделано меню навигации...
background url к тому же span прописываецо при наведении - симпатично - но они ушли от наших проблем путём одинаковости ячеек -(в табличке эти элементы проще делаются
кодом:
<img src='Картинка текущая' onMouseOver="this.src='Картинка при наведении'" onMouseOut="this.src='Картинка текущая'"/>
Deff
Ну если сувать в сайдбар от rps'a то картинки то уже можно подогнать под размер самой большой надписи...
но они ушли от наших проблем путём одинаковости ячеек -(в табличке эти элементы проще делаются
кодом:
Пробывал этот код но только с большими картинками, ужасно работало, на картинки приходилось останавливаться чтоб она поменялась на другую, на лосте работает как то быстро...
И опять же это все будет делаться скриптом? Уже где то слышал высказывание по поводу моего форума что весь в скриптах...долго грузится... так то идей много было, переставить меню навигации, сделать вход и регистрацию в сайдбар таким методом скрин*. но опять же слово скрипт
поэтому как то и стремился все делать через css...
Добавлено: дубль 2 прикрепляем изображения
Отредактировано Invisible Man (Ср, 15 Дек 2010 00:02:13)
Пробывал этот код но только с большими картинками, ужасно работало, на картинки приходилось останавливаться чтоб она поменялась на другую, на лосте работает как то быстро...
нинаю вот тут http://hostjs-mybb2011.narod.ru/Kuran_Yuki.htm кнопки "Новости" "Навигация" и "Игровой процесс" поставлены таким кодом ( может сильно объемные картинки были ?
И опять же это все будет делаться скриптом? Уже где то слышал высказывание по поводу моего
Нет, - Все нтml обычный HTML код, кроме коротенького скрипта прямо в меню на включение доп пунктов для юзера и админа, которые по умолчанию будут скрыты...
Про cкрин "входа", лениво переключать мысли на иное, вроде как пока не остыл насчет меню..
Отредактировано Deff (Ср, 15 Дек 2010 08:42:40)
| Общие вопросы по оформлению (37) | Корзина | Вс, 6 Ноя 2011 |
| Полезные советы при оформлении форума | Справочная | Чт, 29 Апр 2021 |
| Общие вопросы по оформлению (63) | Архив | Пн, 21 Май 2018 |
| несколько вопросов по оформлению. | Корзина | Вс, 30 Май 2010 |
| Корректировка каталога скриптов: дополнение/устранение ошибок | Коллективная работа | Пн, 26 Сен 2022 |
Вы здесь » Единый форум поддержки » Корзина » Оформления меню навигации главных кнопок форума