IOS iphone 4s not repainting dynamic images that a

2019-08-05 07:24发布

问题:

I have been suffering from a bug for sometime:

I am doing something like the following:

$container.on('touchmove', function(){
   $container.trigger( 'lazyload.appear');
});

$img.one( 'lazyload.appear', function(){
   var that= this;
   var $self= $(that);
   $self.css('background-image', "url('real.path.to.img')" );
 });

However, on IOS there seems to be a problem with repainting the background-images, when they are initially outside the viewport. When I drag my finger, until the image is in the viewport, the images aren't painted onto the screen unless i release my finger. I'm trying to aim for real-time, so I would like the image to be revealed as soon as I do a touchmove, but its being revealed at touchend when its initially outside the viewport. However, the console.log outputs that the background-image has changed before releasing my finger. When the image is inside the viewport, the repainting is fine, it repaints instantly as I drag my finger.

This seems to be a bug, or am I missing something? Thank you for your help!