JQuery изменить изображения на ссылки наведите

Question

У меня проблема с кодом ниже. Почему-то я не могу изменить фон изображения с помощью скрипта jQuery.

HTML-код выглядит так:

• часть для отображения изображения:

  <div class="group-image img-responsive img-ctr"></div>
  

• часть для создания связанных ссылок (упрощенно):

  <a class="hoverlink" href="{complete_path}" data-img="{cat_image_path}">{cat_name}</a>

Код jQuery выглядит так:

$(document).ready(function(){
        $('.hoverlink').hover(function(){$('.group-image').css('background', $(this).attr('data-img'))});
});

тег data-image содержит правильный URL-адрес изображения для связанных ссылок, но когда я наведите курсор мыши на одну из этих ссылок, он не будет добавлен background CSS для group-image дела. JSFillde экзамена

Любая подсказка, где я сделал ошибку?

Спасибо

Answer 1

$('.hoverlink').hover(function(){
    $('.group-image').css('background-image', 'url('+$(this).attr('data-img')+')')
});

Это работает!! Обновленная скрипка

Answer 2

Вам не хватает url('') из вашего второстепенного задания: DEMO

$('.hoverlink').hover(function(){
    $('.group-image').css('background', "url('" + $(this).attr('data-img') + "')")
});