ios

[roboron]

Is there an issue with ios losing the background-size:cover attribute?

[sptutusukanta]

Sorry, I don't have any apple device to test. I request people for contribution.
If @roboron can, you are most welcome.

[rudemex]

I have in fix for the problem of the parallax in safari ios, but it will not have the movement, but at least you do not see the image with zoom.
The problem is in the background-attachement, it is necessary to put scroll as value.
My solution was to add an IF verifying the userAgents, if it is android, ipad, ipod or iphone, applies a class and removes the movement of the scroll, in the else, the original code.

Line 34:

// APPLY DEFAULT CSS
                if ( navigator.userAgent.match(/(Android|iPod|iPhone|iPad)/) ) {
                    $el.css({
                        'background-image': image_url,
                        'background-size': 'cover',
                        'background-repeat': local_options.repeat,
                        'background-attachment': 'scroll',
                        'background-position': 'center',
                    });
                }else{
                    var pos_y =  local_options.offset + ($el.offset().top - $(window).scrollTop()) * (1 - local_options.speed );
                    $el.css({
                        'background-image': image_url,
                        'background-size': local_options.size,
                        'background-repeat': local_options.repeat,
                        'background-attachment': 'fixed',
                        'background-position': local_options.pos_x + ' ' + pos_y + 'px',
                    });

                    $(window).scroll( function(){
                            //var pos_y = - ( $(window).scrollTop() - $el.offset().top ) * ( 1 + local_options.speed ) - ( $el.offset().top * local_options.speed );
                            var pos_y =  local_options.offset + ($el.offset().top - $(window).scrollTop()) * (1 - local_options.speed );
                            $el.data( 'pos_y', pos_y );
                            $el.css( 'background-position', local_options.pos_x + ' ' + pos_y + 'px' );
                        }
                    );
                }