ネットアンサー55備忘録

pc←→SPでの画像サイズの切り替えをjQueryで設定しております。
デモ01

<div class="wrap bg_cream">
	<section class="inner">
		<div id="box01">
		<h2>画像サイズレスポンシブ</h2>
		<ul class="img_change" style="list-style: none;">
			<li><img class="chimg2" data-pc-src="images/visual01_pc.jpg" data-sp-src="images/visual01_sp.jpg" alt="" /></li>
			<li><img class="chimg2" data-pc-src="images/visual02_pc.jpg" data-sp-src="images/visual02_sp.jpg" alt="" /></li>
			<li><img class="chimg2" data-pc-src="images/visual03_pc.jpg" data-sp-src="images/visual03_sp.jpg" alt="" /></li>
		</ul>
		</div><!-- / #box01 -->
	</section>
</div>

※cssは省力します

function setting(){

	/*PC←→SP ImgChange*/
	$(window).on('load resize', function(){
		var wid = $(window).width();
		imgChange(wid);

	});
	function imgChange(wid){
		if( wid < 767 ){
			$('.chimg2').each(function(){
				$(this).attr("src",$(this).data("sp-src"));
			});

		}else if( wid > 767 ){
			$('.chimg2').each(function(){
				$(this).attr("src",$(this).data("pc-src"));
			});
		};
	};

};

$(document).ready(function(){
	setting();
});