Как изменить задний фон родительского элемента в списке при наведении на li элемент?

Question

[ProjectDCL]

<ul id="burger-menu-list">
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration1">Блок1</font></a></li>
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration2">Блок2</font></a></li>
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration3">Блок3</font></a></li>
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration4">Блок4</font></a></li>
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration5">Блок5</font></a></li>
      <li class="burger-menu-link-wrap"><a href="#"><font id="burger-textdecoration6">Блок6</font></a></li>

      </ul>

Мне нужно чтобы при наведении на элемент li менялся задний фон( на нем стоит просто цвет, а должна появляться картинка).


Понимаю, что нужно как-то использовать hover , но он должен работать на другом элементе (ведь участвует id="burger-textdecoration1" на который нужно наводить, чтобы появилась картинка и id="burger-menu-list" - поля и родитель на заднем фоне которого появится картинка!

Заранее спасибо всем кто поможет! Уже очень долго не могу решить данную проблему!

Comments

[Сергей delphinpro]

Селектора родителя нет, равно как и селектора предыдущего элемента.
Если задача описана точно, то у вас только один путь - javascript

[Сергей delphinpro]

Да, и код бы не помешал...

[ProjectDCL]

Сергей: Код я добавил, можете подсказать как это сделать на js ? Просто уже перепробовал много вариантов, но результатов нет вообще. Заранее благодарен!

[Сергей delphinpro]

$('.burger-menu-link-wrap font').on('mouseenter', function(){
  $('#burger-menu-list').css({
    backgroundImage: 'url(image.jpg)'
  });
});

[ProjectDCL]

Сергей: Спасибо большое, вы мне очень помогли, но остался последний вопрос: Как сделать чтобы после того как убираешь курсор с мышки убиралась и картинка?!

[Сергей delphinpro]

on('mouseleave', ...

[ProjectDCL]

Сергей: А можно ли сделать чтобы картинка появлялась и пропадала более плавно?

[Сергей delphinpro]

ProjectDCL: сделать можно всё. но это сложнее. нужен дополнительный блок в котором будет менятся фоновая картинка, а сам блок плавно появляться-исчезать (через транзишн в css или энимейт в jquery ).

[ProjectDCL]

Сергей: Хорошо! Спасибо большое! Я могу как-то оценить вашу работу? Засчитать что вы решили мою задачу? Просто с сайтом пока что не очень хорошо знаком! Еще раз спасибо!