Jquery change background-image

Я пытаюсь поменять местами два изображения с помощью jQuery. Используя событие зависания, которое я пробовал:

$("#wlt-DealView .buyButton_new").mouseover(function(e){
    $('.buyButton_new').css('background-image','url(../images/compra_mouseOver.png)');
});
$("#wlt-DealView .buyButton_new").mouseout(function(e){
    $('.buyButton_new').css('background-image','url(../images/compra_normal.png)');
});

Но изображение не отображается, и после того, как я получу от него мышь, он запускает второе событие. Он должен обновляться с первым изображением, но это не так.

Вы можете посмотреть здесь: http://107.20.186.103/deals/cuerpon.

Наведите на кнопку ПОКУПАТЬ.

ОТВЕТЫ

Ответ 1

Если я попытаюсь ввести URL-адрес http://107.20.186.103/images/compra_mouseOver.png вручную в моем браузере, я получаю 404.

http://107.20.186.103/deals/images/compra_mouseOver.png получает странный 500...

Я думаю, вы должны подготовить свои файлы изображений, и это сработает. Вы также можете настроить свой код с помощью функции jQuery.hover.

Ответ 2

Изображение исчезает, потому что jQuery заменяет CSS локально, а не из вашей таблицы стилей, как и раньше. Таким образом, ваш путь должен быть обновлен, чтобы отразить путь от вашего HTML файла к вашему изображению. Если ваш HTML файл находился в вашей корневой папке и "образы" - папке внутри этого корня, код будет выглядеть следующим образом:

$('.buyButton_new').css('background-image','url(images/compra_mouseOver.png)');

испортил меня тоже.

Ответ 3

Попробуйте, код в любом случае лучше:

$("#wlt-DealView .buyButton_new").hover(
    function()
    {
        $(this).css('background-image','url(../images/compra_mouseOver.png)');
    },
    function()
    {
        $(this).css('background-image','url(../images/compra_normal.png)');
    }
);

Ответ 4

Синтаксис выглядит следующим образом

$(element).hover(function(){
  $(this).css(whatever);
}, function(){
  $(this).css(whatever);
});

Ответ 5

добавить полный путь к изображению и проверить

$("#wlt-DealView .buyButton_new").hover(
    function()
    {
        $(this).css('background-image','url(http://107.20.186.103/themes/classic/images/compra_mouseOver.png)');
    },
    function()
    {
        $(this).css('background-image','url(http://107.20.186.103/themes/classic/images/compra_normal.png)');
    }
);

Ответ 6

Используйте jQuery.hover вместо mouseover и mouseout