画面サイズによって画像を入れ替える
'18.12.08620pxを基準に画像を切り替える場合、
</body>タグの直線に以下のコードを記載
<script> $(function(){ var $setElem = $('.switch'), pcName = '_pc', spName = '_sp', repWidth = 621; $setElem.each(function(){ var $this = $(this); function imgSize(){ if(window.innerWidth > repWidth) { $this.attr('src',$this.attr('src').replace(spName,pcName)).css({visibility:'visible'}); } else { $this.attr('src',$this.attr('src').replace(pcName,spName)).css({visibility:'visible'}); } } $(window).resize(function(){imgSize();}); imgSize(); }); }); </script>
「repWidth」の値がブレイクポイント。
CSSに以下を記載
.switch { visibility:visible; }
(View1740)