Hi everyone,
i am doing a website where I have a list of images (I have at least 5 images per page that need re-sizing) with a certain width. Not when I try re-sizing the window I want the smaller size to be loaded dynamically, but it is not happening. Can someone please help me? thanks in advance.
Here is a snippet of the code:
function adjustImage() {
var winSize = $(window).width;
var img_src = $('img').attr('src');
if ((winSize > 800) && (winSize < 1400)) {
var new_image = img_src.replace('_full', '_medium');
$('img').attr('src', new_image);
}
}
HTML
<div id="right_col" class="group">
<ul>
<li><img src="images/arch/de_1/floor_plan_full.jpg" alt="floor_plan" class="tet"></li>
<li><img src="images/arch/de_1/el_01_full.jpg" alt="elevation" class="tet"></li>
<li><img src="images/arch/de_1/el_02_full.jpg" alt="elevation" class="tet"></li>
<li><img src="images/arch/de_1/el_03_full.jpg" alt="elevation" class="tet"></li>
</ul>
</div>