Envy Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 Напишите пожалуйста статью как делать кнопки типа как на мафии в горизонтальном меню, т.е сначала она черного цвета , при наведении синего, или серого->черного, а то до меня не доходит, как это реализовать Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 в css прописвать класс, с добавление .a hover Envy 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 21 мая, 2013 Автор Поделиться Опубликовано 21 мая, 2013 WOLF, а потом, как я понял <div id="названиекласса"> ? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 WOLF, а потом, как я понял <div id="названиекласса"> ? да Envy 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 21 мая, 2013 Автор Поделиться Опубликовано 21 мая, 2013 WOLF, можно пример кода из ipb_styles.css? Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 WOLF, можно пример кода из ipb_styles.css? #community_app_menu > li > a { color: #cacaca; color: rgba(255,255,255,0.7); display: block; outline: none; padding: 0px 12px; line-height: 32px; height: 32px; } #community_app_menu > li > a:hover { background: url("{style_images_url}/trans10.png") repeat; background: rgba(0,0,0,0.1); color: #fff; } Envy 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 21 мая, 2013 Автор Поделиться Опубликовано 21 мая, 2013 WOLF, Спасибо большое! Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Lordbl4 Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 (изменено) как в этом случае сделать так, чтобы фон был на всю полосу меню а не отступал от нижнего края на 3 пикселя? кнопка быстрого перехода нормально выделяется при наведении, а в остальном меню отступ идёт Изменено 21 мая, 2013 пользователем Lordbl4 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 как в этом случае сделать так, чтобы фон был на всю полосу меню а не отступал от нижнего края на 3 пикселя? кнопка быстрого перехода нормально выделяется при наведении, а в остальном меню отступ идёт дай ссылку Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Lordbl4 Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 на локале тестирую, могу код скинуть необходимый Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 на локале тестирую, могу код скинуть необходимый Давай Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Lordbl4 Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 (изменено) элемены меню при наведении отображаются с отступом от нижнего края, справа быстрый переход (как я понял quickNavLaunch) нормально отображается при наведении #community_app_menu > li { margin: 0px 1px 0 0; position: relative; } #community_app_menu > li > a { color: #FFF; display: block; font-size:14px; padding:12px 9px; font-weight:400; text-shadow: 0 1px 0 rgba(0,0,0,.4); text-decoration:none; -webkit-transition: all 0.35s ease; -moz-transition: all 0.35s ease; -o-transition: all 0.35s ease; transition: all 0.35s ease; text-transform:uppercase; } #community_app_menu > li > a:hover, #community_app_menu > li > a.menu_active, #community_app_menu > li.active > a { background: #ff00ff url({style_images_url}/glow.png) repeat-x; color:#FFF; outline: 0; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; -ms-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear; } #icon-nav_app_forums ul.nav a:hover, #icon-nav_app_forums ul.nav a, #icon-nav_app_forums .active a { border-radius: 0 !important; } #icon-nav_app_forums a:hover, #icon-nav_app_forums a, #icon-nav_app_forums .active a { border-radius:3px 0 0 3px; } a#quickNavLaunch, a#quickNavLaunch:hover { border-radius:0 3px 3px 0; margin-right: -1px; } Изменено 21 мая, 2013 пользователем Lordbl4 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 элемены меню при наведении отображаются с отступом от нижнего края, справа быстрый переход (как я понял quickNavLaunch) нормально отображается при наведении #community_app_menu > li { margin: 0px 1px 0 0; position: relative; } #community_app_menu > li > a { color: #FFF; display: block; font-size:14px; padding:12px 9px; font-weight:400; text-shadow: 0 1px 0 rgba(0,0,0,.4); text-decoration:none; -webkit-transition: all 0.35s ease; -moz-transition: all 0.35s ease; -o-transition: all 0.35s ease; transition: all 0.35s ease; text-transform:uppercase; } #community_app_menu > li > a:hover, #community_app_menu > li > a.menu_active, #community_app_menu > li.active > a { background: #ff00ff url({style_images_url}/glow.png) repeat-x; color:#FFF; outline: 0; -webkit-transition: all 0.1s linear; -moz-transition: all 0.1s linear; -ms-transition: all 0.1s linear; -o-transition: all 0.1s linear; transition: all 0.1s linear; } #icon-nav_app_forums ul.nav a:hover, #icon-nav_app_forums ul.nav a, #icon-nav_app_forums .active a { border-radius: 0 !important; } #icon-nav_app_forums a:hover, #icon-nav_app_forums a, #icon-nav_app_forums .active a { border-radius:3px 0 0 3px; } a#quickNavLaunch, a#quickNavLaunch:hover { border-radius:0 3px 3px 0; margin-right: -1px; } редактируешь: padding: 12px 9px; на свой вкус Respected 1 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Lordbl4 Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 (изменено) частично решено, спасибо. Изменено 21 мая, 2013 пользователем Lordbl4 Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 частично решено, спасибо. можно кодом: height: ..px ; подправить Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 21 мая, 2013 Автор Поделиться Опубликовано 21 мая, 2013 (изменено) WOLF,не получается использовать( вывожу дивом - ничего не происходит Изменено 21 мая, 2013 пользователем Envy Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 21 мая, 2013 Поделиться Опубликовано 21 мая, 2013 WOLF,не получается использовать( вывожу дивом - ничего не происходит ты весь код меню удалил чтоль? или просто приписываешь свои пункты, т.к. если бы не удалял там бы вообще рыться не нужно было бы Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 21 мая, 2013 Автор Поделиться Опубликовано 21 мая, 2013 WOLF, я не меню редактирую, с меню все норм, я вообще) WOLF,напиши статью( Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 22 мая, 2013 Автор Поделиться Опубликовано 22 мая, 2013 Пытаюсь сделать такой эффект на этих кнопках, ничего не получается, они просто перекашиваются.. _trade-team.ru снизу, где статистика "набор модераторов", "контакты администрации", "группа в Steamcommunity" Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
WOLF Опубликовано 22 мая, 2013 Поделиться Опубликовано 22 мая, 2013 .i_am_fedya_link { padding-top: 8px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; line-height: 1.3; overflow: hidden; -webkit-box-shadow: 0px 1px 0px white; -moz-box-shadow: 0px 1px 0px #fff; box-shadow: 0px 1px 0px white; border: 1px solid #D8D8D8; border-radius: 3px; background: #fff; } +++++ .i_am_fedya_link : hover { padding-top: 8px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; line-height: 1.3; overflow: hidden; -webkit-box-shadow: 0px 1px 0px white; -moz-box-shadow: 0px 1px 0px #fff; box-shadow: 0px 1px 0px white; border: 1px solid #D8D8D8; border-radius: 3px; background: #000; } пробуй оба кода должны быть в ipb_style.css Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Envy Опубликовано 23 мая, 2013 Автор Поделиться Опубликовано 23 мая, 2013 .i_am_fedya_link : hover { padding-top: 8px; padding-bottom: 10px; padding-left: 10px; padding-right: 10px; line-height: 1.3; overflow: hidden; -webkit-box-shadow: 0px 1px 0px white; -moz-box-shadow: 0px 1px 0px #fff; box-shadow: 0px 1px 0px white; border: 1px solid #D8D8D8; border-radius: 3px; background: #000; } не изменяется, только блок в середине уходит в лево Цитата Ссылка на комментарий Поделиться на другие сайты Поделиться
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.
Примечание: Ваш пост будет проверен модератором, прежде чем станет видимым.