Бесплатный форум: форум поддержки
Добро пожаловать на форум поддержки сервиса Forum2x2 !

Для полноценной работы с форумом,
пожалуйста, войдите на форум под своим логином (если вы уже зарегистрированы) или же зарегистрируйтесь.


С нашей помощью вы можете создать форум,
похожий на этот!
Поделиться ссылкой

Мы в социальных сетях



- Правила форума -

для обязательного прочтения!


Внимание! Важная информация для РЕГИСТРАЦИИ на форуме:

Пожалуйста, не регистрируйтесь на этом форуме с электронными адресами mail.ru, bk.ru, inbox.ru, list.ru - вам может не прийти письмо со ссылкой активации!
Вы можете воспользоваться адресами типа yandex.ru, rambler.ru, gmail.com и т.д.
Интересные решения
Быстрый переход к сервисам: JPG-Net Видео фоторедактор Транслит
Видео-туториалы
Настройка шапки форума
Категории и подфорумы - 1
Создание портала
Модули
Виджеты
Как присваивать награды
Выброс кубиков
Pop-up для входа на форум
Настроение в профиле

Варианты анимированного меню

Предыдущая тема Следующая тема Перейти вниз

Варианты анимированного меню

Сообщение автор Sunnyta в Чт 10 Июн - 19:24

Спасибо Дане за урок по анимированному меню good

Вы, возможно, встречали на просторах инета... еще такой вариант:
- при наведении на текстовую ссылку в меню появляется обводка типа такой, как я нарисовала (делала быстро, поэтому не кидайтесь вениками) -
Т.е. текстовая ссылка получается обведенной таким образом.

Думаю, что это конкретный CSS... но насколько осуществим такой вариант в нашем меню?

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Чт 10 Июн - 19:46

Т.е. что-то вроде этого?

Код:
a.mainmenu:hover {
padding:5px;
border: 5px solid #C0C0C0;
-moz-border-radius: 10px; /* Firefox */
-webkit-border-radius: 10px; /* Safari, Chrome */
-khtml-border-radius: 10px; /* KHTML */
border-radius: 10px; /* CSS3 */
}


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Чт 10 Июн - 19:51

Как вариант тоже подойдет girl_yes
... но я имела в виду такую рисованную типа от руки обводочку, поэтому спецом и рисовала кистью

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Ринкате в Чт 10 Июн - 19:56

Спасибо Дана))

Ринкате
 
 

Пол : Мужчина
Сообщения : 816
Возраст : 23
Место обитания : Rain
Настроение : Изменчивое
Карма : Без предупреждений
Благодарности : 161
Регистрация : 2010-05-28

http://soul-eater.sosbb.ru/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Чт 10 Июн - 19:57

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

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Чт 10 Июн - 20:02

Тогда необходимо будет фиксировать ширину каждой текстовой ссылки и подставить изображение с обводкой им в фон.
Как это можно зафиксировать? wink

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Ринкате в Чт 10 Июн - 20:16

Код:
a.mainmenu:hover {
padding:0 px;
border: 1px solid #E69898;
-moz-border-radius: 1px; /* Firefox */
-webkit-border-radius: 1px; /* Safari, Chrome */
-khtml-border-radius: 1px; /* KHTML */
border-radius: 5px; /* CSS3 */
}
- Просто веди это, вот оптималка)

Ринкате
 
 

Пол : Мужчина
Сообщения : 816
Возраст : 23
Место обитания : Rain
Настроение : Изменчивое
Карма : Без предупреждений
Благодарности : 161
Регистрация : 2010-05-28

http://soul-eater.sosbb.ru/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Чт 10 Июн - 20:43

@Ринкате пишет:
- Просто веди это, вот оптималка)
Речь шла несколько о другом girl_yes

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Чт 10 Июн - 20:44

@Sunnyta пишет:
Тогда необходимо будет фиксировать ширину каждой текстовой ссылки и подставить изображение с обводкой им в фон.
Как это можно зафиксировать? wink
Как вариант:

Код:
a.mainmenu, a.mainmenu:hover {
height: 40px;
padding-top:10px;
vertical-align:middle;
display:inline-block;
/* для корректного отображения в старых браузерах */
display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}

a.mainmenu:hover {
background: transparent url('http://i61.servimg.com/u/f61/14/71/65/95/afds110.png') top center no-repeat;
width: 100px;
}

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Чт 10 Июн - 20:48

Ё!!! Вот это как раз - то самое ... thank
*ой, это для бб2?

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Чт 10 Июн - 20:51

mainmenu сработает на любом движке yes

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Ринкате в Пт 11 Июн - 11:17

Dana ты лучшая)!

Ринкате
 
 

Пол : Мужчина
Сообщения : 816
Возраст : 23
Место обитания : Rain
Настроение : Изменчивое
Карма : Без предупреждений
Благодарности : 161
Регистрация : 2010-05-28

http://soul-eater.sosbb.ru/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор ryslik2010 в Пт 11 Июн - 12:43

Sunnyta,а как ты сделала у себя на форуме возле каждой кнопки навигации при наведении смайл?

ryslik2010
 
 

Пол : Мужчина
Сообщения : 341
Возраст : 21
Место обитания : юпитер
Карма : Без предупреждений
Благодарности : 10
Регистрация : 2009-03-30

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Пт 11 Июн - 13:42

Код:
a.mainmenu:hover {
background-image:url("ССЫЛКА КАРТИНКИ"); /* Путь к изображению при наведении */
background-position:0 0;
background-repeat:no-repeat;
padding-bottom:25px;
padding-left:25px;
}

wink

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор ryslik2010 в Пт 11 Июн - 14:26

13 Sunnyta

ryslik2010
 
 

Пол : Мужчина
Сообщения : 341
Возраст : 21
Место обитания : юпитер
Карма : Без предупреждений
Благодарности : 10
Регистрация : 2009-03-30

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Sunnyta в Вс 13 Июн - 18:50

Да, не за что ...
Внесла поправки, чтоб работало и в ИЭ (по наводке Даны)
Код:
a.mainmenu:hover {
background-image:url("ССЫЛКА КАРТИНКИ"); /* Путь к изображению при наведении */
background-position:0 0;
background-repeat:no-repeat;
padding-left:25px;
padding-bottom:25px;
display:inline-block;
/* для корректного отображения в старых браузерах */
display:-moz-inline-stack;
zoom:1;
*display:inline;
_overflow:hidden;
}

*хотя при этом CSS появляется дергание навигации и таблицы форума, если кто-то предложит более корректный вариант, то будем премного благодарны

Sunnyta
 
 

Сообщения : 1604
Карма : Без предупреждений
Благодарности : 63
Регистрация : 2008-03-20

http://www.sun-place.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Boss в Вс 13 Июн - 20:09

а где инструкция по анимированию меню?

Boss
 
 

Пол : Мужчина
Сообщения : 162
Возраст : 20
Карма : Без предупреждений
Благодарности : 0
Регистрация : 2010-06-11

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Вс 13 Июн - 20:17

В первом посте.


Где находится CSS?
Па > Оформление > Цвета > Каскадная таблица стилей CSS


Где искать основные шаблоны?
ПА > Оформление > Шаблоны > Общие настройки


Где находится раздел для подключения скриптов
ПА > Модули > Управление кодами Javascript



Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Boss в Вс 13 Июн - 20:44

где в первом посте?я не про выделение

Boss
 
 

Пол : Мужчина
Сообщения : 162
Возраст : 20
Карма : Без предупреждений
Благодарности : 0
Регистрация : 2010-06-11

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Вс 13 Июн - 20:45

Тогда про что?

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 20:48


Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 23:31

Диан, вопрос по меню.
Ставлю девушке на форум кнопки которые сделал.
Как сказано тут http://help.forum2x2.ru/forum-f13/tema-t10539.htm
P.s. Прочитать что написано в примечании я не смог, т.к. спойлер не работает.
Форум вот http://dogster.forumy2x2.com/index.htm
Кнопки съезжают куда-то влево + работают только две.


Последний раз редактировалось: Total_Admin (Вс 13 Июн - 23:58), всего редактировалось 1 раз(а)

Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Вс 13 Июн - 23:42

Численные значения изменены под размеры кнопок? У меня в примере даны 37px, в ее коде должны быть 65px

Я сейчас смотрю с 3-х браузеров - все нормально.


Последний раз редактировалось: Dana Domirani (Вс 13 Июн - 23:46), всего редактировалось 1 раз(а)

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 23:45

Численные значения изменены под размеры кнопок?
Да.
На следующие:
Код:
height: 65px
и
margin-top:-65px

Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 23:49

Я сейчас смотрю с 3-х браузеров - все нормально.
У меня Опера 10.01. Обновления всё руки недоходили поставить...
Сейчас посмотрю под другим браузером...

Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 23:50

Да, это Опера у меня чудит.
В IE 7 всё нормально...

Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Dana Domirani в Вс 13 Июн - 23:51

Все отображается и работает нормально (Опера 10.53):

Dana Domirani
Администратор
Администратор

Пол : Женщина
Сообщения : 21913
Возраст : 31
Место обитания : СПб
Карма : Без предупреждений
Благодарности : 8761
Регистрация : 2008-04-18

http://poltergeist-legacy.com/

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор Pure в Вс 13 Июн - 23:55

У меня Опера 10.01. Обновления всё руки недоходили поставить...
Сижу обновляю))))

Pure
 
 

Пол : Мужчина
Сообщения : 2154
Возраст : 96
Карма : Без предупреждений
Благодарности : 228
Регистрация : 2008-10-21

http://www.admin2x2.ru

Вернуться к началу Перейти вниз

Re: Варианты анимированного меню

Сообщение автор DeniDRW в Вс 20 Июн - 15:07

уххххх.... вернусь с работы сегодня и сразу же попробую!! 22
Дана ОГРОМНОЕ 13

DeniDRW
 
 

Пол : Мужчина
Сообщения : 39
Возраст : 28
Место обитания : IL
Карма : Без предупреждений
Благодарности : 0
Регистрация : 2010-05-16

Вернуться к началу Перейти вниз

Предыдущая тема Следующая тема Вернуться к началу


 
Права доступа к этому форуму:
Вы не можете отвечать на сообщения