Как сделать css анимацию для списков меню при наведении?

Question

[Isaac Clark]

Здравствуйте.
Есть такой код:

<ul className="vertical medium-horizontal menu">
    <li>
        <a className="dropdown button" href="#">1</a>
        <a  href="#">1</a>
    </li>
</ul>

Эффект для анимации при наведении на stylus

li a:first-child
      background-color #ff8731
      background-size 100% 200%
      background-image linear-gradient(to bottom, #ff8731 50%, #fff 50%)
      transition background-position 0.3s

 li a:last-child
      background-color #fff
      background-size 100% 200%
      background-image linear-gradient(to bottom, #fff 50%, #ff8731 50%)
      border-top 1px solid #fff
      border-top-left-radius 0
      border-top-right-radius 0
      color #0073AE
      display none
      margin-top -10px
      transition background-position 0.3s

li a:last-child:hover
      background-position 0 -100%
      color #fff

Вопрос: как сделать так, чтоб при наведении на a:last-child у a:first-child запускалась такая же анимация, как и у a:last-child?

Answer 1

[L0k1]

li:hover a:last-child,
li:hover a:first-child{}

об этом вопрос шоле?

а зачем вам псевдоклассы в данном коде вообще?

Comments

[Isaac Clark]

нет, мне нужно во время наведения на последний элемент проигрывать анимацию для первого элемента.

[L0k1]

Isaac Clark: а будут еще и промежуточные элементы между первым и последним? при наведении проигрывать анимацию на первом, а на последнем не проигрывать? да вообще - привакайте выкладывать куда-то код, есть же куча сервисов

[Isaac Clark]

L0k1: промежуточных не будет, только два элемента всегда