jquery - Trying to swap image url's for a blurred up look but getting flickering -


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

hey, above link example.

i have div inline background-image 50px wide, , set cover , center center. have transition: 200ms ease-in-out on smooth out fade.

essentially want load super fast , blurred out, does, swap in larger image.

sometimes works perfect, on initial page load it's super quirky, upon refresh fine.

basically function swaps large image url data-image img tag after 300ms. removes original background image.

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); 

any idea's on how improve appreciated.


Comments

Popular posts from this blog

Django REST Framework perform_create: You cannot call `.save()` after accessing `serializer.data` -

Why does Go error when trying to marshal this JSON? -