1

以下のコードに問題があります。どういうわけか、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'))});
});

backgrounddata-image タグには、関連リンクの画像への正しい URL が含まれていますが、これらのリンクのいずれかにカーソルを合わせると、 CSS がgroup-imagedivに追加されません。例のJSFillde

どこでエラーを起こしたのか手がかりはありますか?

ありがとう

4

2 に答える 2

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

これは機能します!! 更新されたフィドル

于 2014-09-12T16:58:31.003 に答える
0

url('')バックグラウンドの割り当てに欠落しています: DEMO

$('.hoverlink').hover(function(){
    $('.group-image').css('background', "url('" + $(this).attr('data-img') + "')")
});
于 2014-09-12T17:00:53.507 に答える