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

Discussion in 'Вопросы по работе с меню' started by Аня, Jun 1, 2013.

  1. Аня
    Offline

    Аня Пользователь

    Joined:
    Apr 7, 2008
    Messages:
    177
    Likes Received:
    11
    Gender:
    Female
    Добрый день, подскажите пожалуйста все темы пересмотрела, что-то подобного не нашла. Мне необходимо сделать меню с уникальными картинками, но помимо этого, при наведении на пункт меню изображение должно быть анимированным и так же у каждого пункта меню свою картинка. Это можно реализовать стандартными способами или необходимо для каждого пункта создавать свой вид в css?
     
    Аня, Jun 1, 2013
    #1

  2. Ads Master

     
  3. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    А что под подразумевается под этими способами?

    Стандартно у каждого пункта (тег LI) есть свой уникальный класс CSS, с их помощью и делается... в CSS. Также в настройках пункта меню можно задать CSS-класс для ссылки - тега А.
     
    OlegM, Jun 1, 2013
    #2
  4. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    почти для каждого
    как сказал OlegM, существует определённый класс (для всех разный или с добавлением)
    для всех пунктов прописывается что то общее
    а потом для каждого отдельно прописывается обычная картинка и картинка при наведении
    анимированые картинки это .GIF
     
    woojin, Jun 2, 2013
    #3
  5. Аня
    Offline

    Аня Пользователь

    Joined:
    Apr 7, 2008
    Messages:
    177
    Likes Received:
    11
    Gender:
    Female
    Спасибки я так и поняла, сейчас как раз картинки доделываю и буду пробовать внедрить. Единственно получается к каждому тегу li нужно будет присвоить ID пункта меню? Или нет? Вот здесь немного застопорилась
     
    Аня, Jun 3, 2013
    #4
  6. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    к примеру общий класс
    Код (html):
    1. .pic {
    2.  тут какие то общие действия с картинками
    3. }

    и дополнительные классы для каждого пункта меню
    Код (html):
    1. .p1 {
    2.  background-image: url (тут адрес первой картинки)
    3. }
    4. .p2 {
    5.  background-image: url (тут адрес второй картинки)
    6. }
    7. .p3 {
    8.  background-image: url (тут адрес третьей картинки)
    9. }


    окончательный html твоего меню будет выглядеть так:
    Код (html):
    1. <ul>
    2.    <li class="pic p1">первый пункт</li>
    3.    <li class="pic p2">второй пункт</li>
    4.    <li class="pic p3">третий пункт</li>


    т.е. классы могут, грубо говоря, "суммироваться"
    или дополнять друг друга
     
    woojin, Jun 3, 2013
    #5
  7. OlegK
    Offline

    OlegK Russian Joomla! Team Staff Member ⇒ Профи ⇐

    Joined:
    Jan 17, 2011
    Messages:
    7,812
    Likes Received:
    771
    Gender:
    Male
    В J 2.5 картинку для пункта меню можно указать в параметрах пункта меню.
    Может и в J 1.7 так.
     
    OlegK, Jun 3, 2013
    #6
  8. OlegM
    Offline

    OlegM Russian Joomla! Team Staff Member

    Joined:
    Apr 12, 2007
    Messages:
    4,310
    Likes Received:
    375
    Gender:
    Male
    Читаем внимательно
    Поэтому смотрим исходный код меню (html-код страницы с меню сайта), смотрим настройки пунктов меню - принимаем решение, как делать.
     
    OlegM, Jun 3, 2013
    #7
    Аня likes this.
  9. Аня
    Offline

    Аня Пользователь

    Joined:
    Apr 7, 2008
    Messages:
    177
    Likes Received:
    11
    Gender:
    Female
    Спасибо большое, буду сегодня реализовывать.
     
    Аня, Jun 3, 2013
    #8
< Как сохранить выделения цветом пункта меня после его нажатия? | Дублируется название пунктов меню >

Share This Page

Loading...