Блог

ВСЕ. У меня есть.

 <div id="imagecontainer" class="header-image-container">amp;nbsp;</div>
  

BG-изображения указаны в css для каждой страницы в соответствии с родительским классом.

 .category-1 #imagecontainer {
background: url(_/images/1.jpg);
}
  

И у меня есть меню. Я хочу переместить BG-изображение ommouse поверх, и при выводе мыши вернуть изображение, указанное в css для этой страницы в соответствии с родительским классом. Я думаю, что это могло бы быть реальным с использованием jQuery. Например, мы открыли страницу категории 3 и навели курсор мыши на пункт меню категории 1 и увидели изображение catefory-1 BG в #imagecontainer, а затем, убрав курсор мыши, снова увидели изображение категории 3 BG.

Я думаю, это подойдет вам:

 $('#menu').mouseenter(function() {
    $('#imagecontainer').css({'background':'blue'});
}).mouseleave(function() {
    $('#imagecontainer').removeAttr('style');
})
  

Вы можете увидеть это в действии здесь:http://jsfiddle.net/Cdzk8 /

Если у вас есть другие встроенные стили в вашем imagecontainer, он также удалит их в mouseleave. В этом случае вам придется сделать что-то более похожее на то, что рекомендует mblase75.

Сохраните текущее фоновое изображение как data перед его заменой и извлеките его оттуда, когда захотите поменять его обратно.

 $('#imagecontainer').mouseover(function() {
    $(this).data('bgimg') = $(this).css('background-image');
    $(this).css('background-image','url(my/new/url.jpg)');
}).mouseout(function() {
    $(this).css('background-image', $(this).data('bgimg'));
});