Natedesigns





Image resize on width width

It was necessary to have a javascript solution, due to CMS, for replacing images based on window width. This was my solution using jQuery.

//Change images on windowWidth
//Store window width
var winWidth = $(window).width();
//get images
var item = $('#listings li a img');

if(winWidth < 960){
//when window less than 960px
   item.each(function() {
   //iterate over each item
      $(this).attr('src', $(this).attr('src').replace(".png", "_Mobile.png"));
      //Replace image ".png" part of image name, with "_Mobile.png" 
   });
}