Background image flickering on chrome / jquery post + div refresh

Question

I have a problem when i refresh some data into a div, which contains background image. The background image flicker on chrome.

Check by yourself on Chrome:

EDIT: Check below, wait for 10 sec, the first 2 pics will start flickering. I hosted them on a similar server i use for my website (it's a friend's wordpress i made). It feels good to finally identify the problem!

var list1 = window.setInterval('refresh()', 1000);

function refresh() {
  data = '<div class="pics" style="background-image:url(http://www.planetgame25.fr/TEST/cow.jpg)"></div>';
  data += '<div class="pics" style="background-image:url(http://www.planetgame25.fr/TEST/peppers.jpg)"></div>';
  data += '<div class="pics" style="background-image:url(https://www.processing.org/tutorials/pixels/imgs/tint1.jpg)"></div>';
  data += '<div class="pics" style="background-image:url(http://science.nasa.gov/media/medialibrary/2011/08/02/the-helix-nebula_.jpg/image_mini)"></div>';
  $('#refresh').html(data);
}

.pics {
  width: 100px;
  height: 100px;
  display: block;
  background-position:center center;
  margin:5px 5px 5px 0;
  float:left;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div id="refresh">
</div>

How to fix this?

Answer 1

Ok thanks anyway, the problem on Chrome will disappear when i'll change to production environement in my htaccess. That was it!