尝试交换图片网址以获得模糊的外观但却出现闪烁

Question

http://electricagenda.com/articles/public-panic-by-steph-copeland

嘿，上面的链接就是一个例子。

我有一个带有内嵌背景图像的div，其宽度为50px，其设置为覆盖和居中。我也有一个过渡：所有200毫秒的轻松进入，以消除褪色。

基本上我想要加载超快速和模糊，然后交换更大的图像。

有时它完美无瑕，有时候在初始页面加载它是超级古怪的，刷新它的罚款。

基本上我的功能只是在300ms后将大图像网址从数据图像交换到img标记。它还会删除原始背景图像。

function loadBackground() {
  var $article_img_bg   = $('#imgFocus .bg-img'),
  $article_img_url  = $article_img_bg.data('bg');

  $article_img_bg.removeAttr('style').css('background','url(' + $article_img_url + '.jpg)' );
    }
setTimeout(loadBackground, 300);

对于如何改进这一点的任何想法都将非常感激。