Правила форума
для обязательного прочтения!
Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:
Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Последние темы
» не работает Тег <hr />автор hawk9951 Вчера в 11:33
» Редактирование
автор irina27 Вчера в 10:10
» Виджет календаря
автор Дмитрий Зверев Сб 21 Апр - 23:20
» Как удалить с форума ссылки на 2x2 форум
автор Dana Domirani Сб 21 Апр - 16:06
» Представляем Пакеты услуг Forum2x2 : новый способ развития форума
автор KatrinaZ Чт 19 Апр - 17:24
» [Общая тема] Заявки на удаление сомнительной рекламы
автор abigal Чт 19 Апр - 14:32
» Вопрос от новичка
автор Dana Domirani Чт 19 Апр - 14:17
» Как убрать возможность писать для определенного гостя? (по айпи)
автор Alex317 Ср 18 Апр - 11:07
» Почему-то стал медленнее загружаться сайт, никаких изменений в последнее время не вносил.
автор Dantes Вт 17 Апр - 8:20
» Красивая цитата
автор hawk9951 Вт 17 Апр - 7:40
Интересные решения
Проблема с установкой анимированной навигации
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Проблемы со скриптами (кодами) :: [Архив] Проблемы со скриптами
Страница 1 из 1 • Поделиться •
Проблема с установкой анимированной навигации
В общем суть в чем. Хотели сделать анимацию кнопок при наведение. Начали работать на тестовике.
Но возникла проблема, все было сделано по рецепту из этой темы: http://help.forum2x2.ru/t10539-topic
Но почему то выглядит это все не так, как хотелось бы. Смотрите здесь: http://test-stalker-cop.forum2x2.ru/
(Наведите на кнопку "Главная")
Но возникла проблема, все было сделано по рецепту из этой темы: http://help.forum2x2.ru/t10539-topic
Но почему то выглядит это все не так, как хотелось бы. Смотрите здесь: http://test-stalker-cop.forum2x2.ru/
(Наведите на кнопку "Главная")
Последний раз редактировалось: Чистый сталкер (Чт 25 Июл - 15:29), всего редактировалось 2 раз(а)
Re: Проблема с установкой анимированной навигации
Стал, ты меня извини, если я не права, но у Даны в туториале написано, что ВСЕ кнопки д.б. одинакового размера, а у тебя на тестовом не так, попробуй сделать все точно

Re: Проблема с установкой анимированной навигации
Сделал все кнопки одинакового размера, ничего не поменялось, все равно какой то баг при наведении.@Sunnyta пишет:Стал, ты меня извини, если я не права, но у Даны в туториале написано, что ВСЕ кнопки д.б. одинакового размера, а у тебя на тестовом не так, попробуй сделать все точно![]()
Re: Проблема с установкой анимированной навигации
Цитирую@Чистый сталкер пишет:
Сделал все кнопки одинакового размера, ничего не поменялось, все равно какой то баг при наведении.
Половинка твоей кнопки - 31pxДана пишет:margin-top:-37px
нужно изменить вручную, они должны быть равны высоте вашей кнопки:

Re: Проблема с установкой анимированной навигации
Я указал в настроках CSS свою ширину. Это не должно никак влиять.
Re: Проблема с установкой анимированной навигации
CSS про меню на твоем тестовике я вижу только это... если так, то это не весь код

- Код:
.mainmenu {
display: -moz-inline-stack;
height: 31px;
overflow: hidden;
vertical-align: top;
}
a.mainmenu img {
margin-top: -31px;
}
a.mainmenu img:hover {
margin-top: 0;
}
Re: Проблема с установкой анимированной навигации
@Sunnyta пишет:CSS про меню на твоем тестовике я вижу только это... если так, то это не весь код![]()
- Код:
.mainmenu {
display: -moz-inline-stack;
height: 31px;
overflow: hidden;
vertical-align: top;
}
a.mainmenu img {
margin-top: -31px;
}
a.mainmenu img:hover {
margin-top: 0;
}
У меня стоит это:
- Код:
.mainmenu {
display:inline-block;
height:31px;
overflow:hidden;
vertical-align: top;
/* для корректного отображения в старых браузерах */
display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}
a.mainmenu img {
margin-top:-31px;
}
a.mainmenu img:hover{
margin-top: 0px;
}
Re: Проблема с установкой анимированной навигации
Каскадная таблица стилей CSS - Опции CSS - Оптимизировать вашу CSS: нет
стоит такое?
стоит такое?
Re: Проблема с установкой анимированной навигации
Еще раз пересмотрела, точно все так, как надо@Чистый сталкер пишет:
У меня стоит это:
- Код:
.mainmenu {
display:inline-block;
height:31px;
overflow:hidden;
vertical-align: top;
/* для корректного отображения в старых браузерах */
display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}
a.mainmenu img {
margin-top:-31px;
}
a.mainmenu img:hover{
margin-top: 0px;
}

Re: Проблема с установкой анимированной навигации
Да, все так стоит. Оптимизации CSS нет. Пусть ответит автор туториала, почему он не работает, как нужно.
Re: Проблема с установкой анимированной навигации
Автор туториала установила образец кнопки http://savepic.org/4152413m.png (с высотой одной кнопки в 31px) по указанному туториалу

себе на теcтовик: http://calidasa.mirbb.net/forum
Парадоксально, но на чистой CSS все работает как нужно:

Поэтому автор туториала предлагает проделать следующее:
1) вырезать из персональной CSS все, что не касается указанного фрагмента настроек меню навигации
2) посмотреть, как после этого будут работать кнопки

себе на теcтовик: http://calidasa.mirbb.net/forum
Парадоксально, но на чистой CSS все работает как нужно:

Поэтому автор туториала предлагает проделать следующее:
1) вырезать из персональной CSS все, что не касается указанного фрагмента настроек меню навигации
2) посмотреть, как после этого будут работать кнопки

Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: Проблема с установкой анимированной навигации
Наконец вы ответили, спасибо. Без персональной CSS кнопки работают идеально. Но почему они работают не так, как должно быть с персональной CSS я не знаю.@Dana Domirani пишет:Автор туториала установила образец кнопки http://savepic.org/4152413m.png (с высотой одной кнопки в 31px) по указанному туториалу
себе на теcтовик: http://calidasa.mirbb.net/forum
Парадоксально, но на чистой CSS все работает как нужно:
Поэтому автор туториала предлагает проделать следующее:
1) вырезать из персональной CSS все, что не касается указанного фрагмента настроек меню навигации
2) посмотреть, как после этого будут работать кнопки
Re: Проблема с установкой анимированной навигации
Можно установить опытным путем: как я уже говорила, вырезаете из персональной CSS все, что не относится к туториальной настройке кнопок меню. Сохраняете CSS так. После этого возвращаете по небольшому фрагменту персональных настроек обратно, сохраняете и смотрите, как добавленный кусок повлиял на кнопки. Если они сбились — значит, проблема обнаружена. Если всё в порядке — добавляете следующий кусок. И так, пока не найдете источник сбоя.Но почему они работают не так, как должно быть с персональной CSS я не знаю.

Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: Проблема с установкой анимированной навигации
Нашел, проблема в этом куске. Но что именно я не знаю.@Dana Domirani пишет:
Можно установить опытным путем: как я уже говорила, вырезаете из персональной CSS все, что не относится к туториальной настройке кнопок меню. Сохраняете CSS так. После этого возвращаете по небольшому фрагменту персональных настроек обратно, сохраняете и смотрите, как добавленный кусок повлиял на кнопки. Если они сбились — значит, проблема обнаружена. Если всё в порядке — добавляете следующий кусок. И так, пока не найдете источник сбоя.
- Код:
/* HEADER------------------------------------------------------*/
#pun-intro{background: transparent url(http://last-emission.ucoz.net/shapka/3.png) no-repeat left;
height: 434px;
width: 953px;
position: relative;
padding-bottom: 250px !important;
top: -px;
padding-right: 0px;}
#pun-title{
color: white !important;
position: absolute !important;
top: 30px;
float: left !important;
text-align: left !important;
font-size: 20px;
font-weight: bold;
text-shadow: black 1px 1px 5px;
margin-left: 0px;}
#pun-desc{
color: white !important;
position: absolute !important;
top: 50px;
float: left !important;
text-align: left !important;
text-shadow: black 1px 1px 5px;
margin-left: 35px;}
#pun-logo {margin-top: 230px;
margin-left: 65px;}
#pun-head #pun-navlinks{
z-index: 999;
height: 25px;
position: relative;
top: -144px;
width: 920px;
padding: 0px;}
#pun-head #pun-navlinks li a{
margin: 0 0px 0 0;
color: white;
font-weight: bold;
position: relative;
top: 3px;
text-shadow: black 1px 1px 5px;
padding-right: 5px;
padding-left: 5px;
font-size: 11px;}
#pun-navlinks ul {text-align: center;}
#pun-head #pun-navlinks li a:hover{
text-shadow: black -1px -1px 3px;
text-decoration: none;
height: 29px;
padding: 5px;
padding-top: 10px;
padding-bottom: 12px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;}
#pun-head #pun-navlinks a[href="/profile.forum?mode=register"]{background: #4a382c;
background-image:url("http://i34.servimg.com/u/f34/13/98/22/00/bg-cen10.jpg");
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
padding: 5px;
padding-top: 10px;
padding-bottom: 12px;
border: 2px solid white;
-moz-box-shadow: 0px 0px 5px #0c0c0c;
-webkit-box-shadow: 0px 0px 5px #0c0c0c;
box-shadow: 0px 0px 5px #0c0c0c;}
#i_icon_mini_new_message{margin-bottom: -5px;}
#hitskin_preview {display: none!important; height:0px!important; } * html #hitskin_preview { display:none!important; height:0px!important;}
/* HEADER-END------------------------------------------------------*/
К сожалению из него я не могу вырезать по отдельности разные части кода, т.к. не видно кнопок после этого.
Re: Проблема с установкой анимированной навигации
Попробуйте выбросить совсем вот это:
- Код:
#pun-head #pun-navlinks li a:hover{
text-shadow: black -1px -1px 3px;
text-decoration: none;
height: 29px;
padding: 5px;
padding-top: 10px;
padding-bottom: 12px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;}

Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |
Re: Проблема с установкой анимированной навигации
Не за что!


Где находится CSS? Па > Оформление > Цвета > Каскадная таблица стилей CSS Где искать основные шаблоны? ПА > Оформление > Шаблоны > Общие настройки Где находится раздел для подключения скриптов ПА > Модули > Управление кодами Javascript |

» Проблемы с установкой Аркон 2005.02 на Win 7x64
» Проблема с визуализацией
» ArCon+2010.03rus. Проблема с экспортом в DWG
» Проблема исчезают стены.
» Проблема с визуализацией
» ArCon+2010.03rus. Проблема с экспортом в DWG
» Проблема исчезают стены.
Бесплатный форум: форум поддержки :: Взаимопомощь и Поддержка :: Проблемы со скриптами (кодами) :: [Архив] Проблемы со скриптами
Страница 1 из 1
Права доступа к этому форуму:
Вы не можете отвечать на сообщения