使用jQuery实现根据窗口大小显示不同的图片

使用jQuery编写代码，根据当前窗口大小显示不同尺寸的图片，能够实现响应式布局，提升用户体验。

<img src="small.jpg" class="resize">
<img src="medium.jpg" class="resize">
<img src="large.jpg" class="resize">

$(window).on('load resize', function() {
  var windowWidth = $(window).width();
  $('.resize').each(function() {
    var imgSrc = $(this).attr('src');
    if (windowWidth < 768) {
      $(this).attr('src', imgSrc.replace('medium', 'small'));
    } else if (windowWidth < 1280) {
      $(this).attr('src', imgSrc.replace('large', 'medium'));
    } else {
      $(this).attr('src', imgSrc.replace('medium', 'large'));
    }
  });
});

免责申明：文章和图片全部来源于公开网络，如有侵权，请通知删除 server@dude6.com