jQuery练习4京东商品详情页面（切换显示中图）

视频

//10. 当鼠标悬停在某个小图上,在上方显示对应的中图
function midumImg() {
  $('#icon_list>li').hover(function () {
    //获取到 自己 src
    var src = $(this).children('img').attr('src')

    //设置中图的src
    var srcMedium = src.replace('.jpg', '-m.jpg')
    $('#mediumImg').attr('src', srcMedium)

    //加红框
    $(this).children('img').addClass('hoveredThumb')
  }, function () {
    $(this).children('img').removeClass('hoveredThumb')
  })
}