Smoothing (sort of)

[Gaspadlo]

I needed simple way to smooth the image change. I think this solution (not really ideal, but kind of works) is least invasive and very easy to implement. (If you "turn" around too quickly, it can cause "ghosting") - i am not really planning improving this thing at the moment, so feel free to use it or improve. Cheers

Just put this script and style anywhere under the reel <IMG>

$(document).ready(function(){
    var oldSrc="";
    var smoothdelay=75;
    setInterval(function(){oldSrc=$('#image-reel img.reel').attr('src');},15)
    $('#image-reel').prepend('<img src="'+oldSrc+'" id="fader">');
    $('#image-reel img.reel').on('load',function(){
        $('#fader').fadeOut(smoothdelay);
        setTimeout(function(){$('#fader').attr('src',$('#image-reel img.reel').attr('src'));},smoothdelay);
        setTimeout(function(){$('#fader').fadeIn(smoothdelay);},smoothdelay);
    });
});

<style>#fader{position:absolute;top:0;left:0;width:100%;z-index:1;background-size:100%!important;display:block;height:100%;}.reel-indicator{z-index:2;}</style>