JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://keith-wood.name/js/jquery.backgroundpos.js"></script>
<div class="fundo"></div>
CSS
.fundo {
width: 500px;
height: 300px;
border: 1px solid #ddd;
background: #fff url("https://lh3.googleusercontent.com/-RTxvEA_h-QE/VL0rqFeJUOI/AAAAAAAAAFA/FnwV5m9cSM0/w1920-h1200/BingWallpaper-2015-01-18.jpg") 50% 50%;
animation: anima-fundo 20s ease 1s infinite alternate;
-webkit-animation: anima-fundo 20s ease 1s infinite alternate;
-moz-animation: anima-fundo 20s ease 1s infinite alternate;
}
JavaScript
var timer1;
$(document).ready(function(){
timer1 = setInterval(function(){
var rnd1 = (Math.floor(Math.random()*100)+1);
var rnd2 = (Math.floor(Math.random()*100)+1);
$('.fundo').css("-webkit-filter", "blur(2px)");
$('.fundo').animate({
'background-position-x': rnd1 + "%",
'background-position-y': rnd2 + "%"
},1500);
$('.fundo').promise().done(function() {
$('.fundo').css("-webkit-filter", "blur(0px)");
});
},2000);
/*
//$('.fundo').css("-webkit-filter", "blur(10px)");
},1000);*/
});