Оформления меню навигации главных кнопок форума

Поделиться81Вт, 14 Дек 2010 13:06:46

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man сокращай отступы для первых пяти на 7 пиксел с обоих сторон

navindex
navuserlist
navextra1
navrules
navsearch

Отредактировано Deff (Вт, 14 Дек 2010 13:09:00)

0

Поделиться82Вт, 14 Дек 2010 13:10:47

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff написал(а):

не рабочая http://onserial-letay-16.ru/uploads/000 … 5012-2.gif

Вот так работает наш сервер (картинка есть и ссылка не битая..)

0

Поделиться83Вт, 14 Дек 2010 13:18:38

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Для
navuserlist
navextra1

еще на 5 уменьшить(для navextra1 можно чуть больше

для navrules на 2 увелич с обеих

Отредактировано Deff (Вт, 14 Дек 2010 13:20:39)

0

Поделиться84Вт, 14 Дек 2010 13:33:01

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff
Не меняца не че :dontknow:

0

Поделиться85Вт, 14 Дек 2010 14:37:43

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

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)

0

Поделиться86Вт, 14 Дек 2010 18:18:55

Автор: rps
Стремясь к новому...
Зарегистрирован: Вс, 12 Окт 2008
Сообщений: 22652
Уважение: +4738
Позитив: +3431
Пол: Мужской
Предупреждения: ‡ 1. 2. 3. ... 10!
Последний визит:
Вс, 14 Мар 2021 21:42:57

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

0

Поделиться87Вт, 14 Дек 2010 18:25:27

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

rps Cогласен, поэтому самый удобный компромисс отдельная табличка с меню с абсолютным позиционированием и со всякими выпадениями и прочее, плюс скрипт с тремя IF на группу пользователей -включающий(обычно для всех скрытые) дополнительные пункты меню

0

Поделиться88Вт, 14 Дек 2010 21:25:05

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff
Спасибо. Поставил но не то все ровно... ~~(надоел уже я чувствую)~~

rps
Думаю теперь согласится с вами...вернусь на исходную :dontknow: Бывает что картинки не дозогружаются....

0

Поделиться89Вт, 14 Дек 2010 21:42:21

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man Сделай красивые кнопки для всех позиций -дай ссылки, - попробуем табличкой

(А для предыдущего равнял ток первые пять(остальные не видны гостю -те проще -цифра одна

и опять по предыдущему
1- выровняй шрифт по левому краю в картинках и обрежь (ну пиксел -два до буквы слево - справо не критично можь и пять и 10
2 - может шрифт имеет смысл на прозрачке - внизу фон белый поставил

Отредактировано Deff (Вт, 14 Дек 2010 21:57:06)

0

Поделиться90Вт, 14 Дек 2010 21:47:19

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff
Ха даж теперь скриптом не получается..расстояние остается между ними... да и пока приживается что ли скрипт :crazyfun: показывает старые иконки, хотя в css их уже нет... А что за табличка, пример можешь дать? или была такая мысля вообще перенести эти кнопки в бокавую панель...

написал же что нет в css у мня не че, обманывать бы не стал...

Отредактировано Invisible Man (Вт, 14 Дек 2010 21:53:50)

0

Поделиться91Вт, 14 Дек 2010 21:52:54

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man да пофигу какая -хоть в боковую - как удобно так и поставим - главное кнопки прорисованные(до наведения и при) и эскиз как ставить примерно

0

Поделиться92Вт, 14 Дек 2010 21:54:48

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man написал(а):

да и пока приживается что ли скрипт показывает старые иконки, хотя в css их уже нет..

Эт кукисы и Историю чистит нужно - у мну аналогично - даж поперся проверять сss

Почистил -сраз перестало глючить

Отредактировано Deff (Вт, 14 Дек 2010 21:56:41)

0

Поделиться93Вт, 14 Дек 2010 21:55:30

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff написал(а):

лавное кнопки прорисованные(до наведения и при) и эскиз как ставить примерно

Хорошо Deff подумаю над этим...

А те кнопки с надписями не подойдут что ли? :dontknow: или они ужасные.....

Отредактировано Invisible Man (Вт, 14 Дек 2010 21:57:28)

0

Поделиться94Вт, 14 Дек 2010 22:57:10

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man Просто в таблице можно всё украсивить и даже если в столбик в сайдбар засунуть
Да и кнопки могут быть посерьезней, - порыскать в гугле - может что понравится, - не, - если хочешь простые - пожалуйста (но они мало чем отличаются от исходных надписей - там просто шрифт и цвет поменять будет тоже самое
( просто даж текущие иконки симпатичней и в табличке они уже жацо не будут
Можно и с текущими

Отредактировано Deff (Вт, 14 Дек 2010 22:59:23)

0

Поделиться95Вт, 14 Дек 2010 23:03:42

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff написал(а):

и даже если в столбик в сайдбар засунуть

Что то типа этого.

Deff написал(а):

Могут быть и посерьезней - порыскать в гугле - может что понравится,

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

Deff написал(а):

но они мало чем отличаются от исходных надписей - там просто шрифт и цвет поменять будет тоже самое

Ну там не сделаешь чтоб менялся цвет был белый, при наведение серый...

Добавлено: Чтоб переливались, как на многих сайтах ....как бы строение форума мое чем то напоминает http://www.lostfilm.tv/ вот там у них прикольно сделано меню навигации...

Отредактировано Invisible Man (Вт, 14 Дек 2010 23:06:08)

0

Поделиться96Вт, 14 Дек 2010 23:31:18

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man написал(а):

Ну там не сделаешь чтоб менялся цвет был белый, при наведение серый...

Без проблем - это в ксс прописываецо background-color: к span элемента

0

Поделиться97Вт, 14 Дек 2010 23:37:34

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man написал(а):

http://www.lostfilm.tv/ вот там у них прикольно сделано меню навигации...

background url к тому же span прописываецо при наведении - симпатично - но они ушли от наших проблем путём одинаковости ячеек -(в табличке эти элементы проще делаются

кодом:

<img src='Картинка текущая' onMouseOver="this.src='Картинка при наведении'" onMouseOut="this.src='Картинка текущая'"/>

0

Поделиться98Вт, 14 Дек 2010 23:56:43

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

Deff
Ну если сувать в сайдбар от rps'a то картинки то уже можно подогнать под размер самой большой надписи...

Deff написал(а):

но они ушли от наших проблем путём одинаковости ячеек -(в табличке эти элементы проще делаются

Deff написал(а):

кодом:

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

0

Поделиться99Ср, 15 Дек 2010 00:01:28

Автор: Invisible Man
Заслуженный
Зарегистрирован: Пн, 5 Апр 2010
Сообщений: 914
Уважение: -3
Позитив: +73
Пол: Мужской
Последний визит:
Вс, 11 Дек 2011 07:08:34

И опять же это все будет делаться скриптом? Уже где то слышал высказывание по поводу моего форума что весь в скриптах...долго грузится... так то идей много было, переставить меню навигации, сделать вход и регистрацию в сайдбар таким методом скрин*. но опять же слово скрипт :canthearyou: поэтому как то и стремился все делать через css...

Добавлено: дубль 2 прикрепляем изображения

Отредактировано Invisible Man (Ср, 15 Дек 2010 00:02:13)

0

Поделиться100Ср, 15 Дек 2010 08:31:10

Автор: Deff
Тутошний...
Зарегистрирован: Ср, 16 Июн 2010
Сообщений: 51119
Уважение: +15200
Позитив: +11601
Последний визит:
Вчера 22:45:52

Invisible Man написал(а):

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

нинаю вот тут http://hostjs-mybb2011.narod.ru/Kuran_Yuki.htm кнопки "Новости" "Навигация" и "Игровой процесс" поставлены таким кодом ( может сильно объемные картинки были ?

Invisible Man написал(а):

И опять же это все будет делаться скриптом? Уже где то слышал высказывание по поводу моего

Нет, - Все нтml обычный HTML код, кроме коротенького скрипта прямо в меню на включение доп пунктов для юзера и админа, которые по умолчанию будут скрыты...
Про cкрин "входа", лениво переключать мысли на иное, вроде как пока не остыл насчет меню..

Отредактировано Deff (Ср, 15 Дек 2010 08:42:40)

0

Единый форум поддержки

Меню навигации

Пользовательские ссылки

Информация о пользователе

Оформления меню навигации главных кнопок форума

Сообщений 81 страница 100 из 121

Поделиться81Вт, 14 Дек 2010 13:06:46

Поделиться82Вт, 14 Дек 2010 13:10:47

Поделиться83Вт, 14 Дек 2010 13:18:38

Поделиться84Вт, 14 Дек 2010 13:33:01

Поделиться85Вт, 14 Дек 2010 14:37:43

Поделиться86Вт, 14 Дек 2010 18:18:55

Поделиться87Вт, 14 Дек 2010 18:25:27

Поделиться88Вт, 14 Дек 2010 21:25:05

Поделиться89Вт, 14 Дек 2010 21:42:21

Поделиться90Вт, 14 Дек 2010 21:47:19

Поделиться91Вт, 14 Дек 2010 21:52:54

Поделиться92Вт, 14 Дек 2010 21:54:48

Поделиться93Вт, 14 Дек 2010 21:55:30

Поделиться94Вт, 14 Дек 2010 22:57:10

Поделиться95Вт, 14 Дек 2010 23:03:42

Поделиться96Вт, 14 Дек 2010 23:31:18

Поделиться97Вт, 14 Дек 2010 23:37:34

Поделиться98Вт, 14 Дек 2010 23:56:43

Поделиться99Ср, 15 Дек 2010 00:01:28

Поделиться100Ср, 15 Дек 2010 08:31:10