2014-11-19 2 views
0

Привет, я пытаюсь создать сайт parallax. Мой код хорошо работает в каждом браузере. Но я столкнулся с проблемой на ipad. В ipad background-size: обложка не работает.'background-size: cover' не работает в ipad

Вот мой код:

$(document).ready(function(){ 
 
    $('section[data-type="background"]').each(function(){ 
 
    var $bgobj = $(this); // assigning the object 
 
    $(window).scroll(function() { 
 

 
     // Put together our final background position 
 

 
     var yPos = -($window.scrollTop()/$bgobj.data('speed')); 
 
     var coords = '50% '+ yPos + 'px'; 
 

 
     // Move the background 
 
     $bgobj.css({ backgroundPosition: coords }); 
 

 
    }); 
 
    }); 
 
});
#section1 { 
 
    background: url(images/hlfs-image.jpg) 0% 0% no-repeat fixed; 
 
    min-height: 1000px ; 
 
    height: 1000px ; 
 
    margin: 0 auto ; 
 
    width: 100%; 
 
    max-width: 1920px ; 
 
    position: relative ; 
 
    background-size:cover ; 
 

 
}
<section id="section1" data-type="background" data-speed="10" class="pages"> </section>

Может кто-нибудь дать мне решение

Выход Output at browser

Output at ipad

ответ

0

попробуйте использовать

#section1 { 
     background: url(images/hlfs-image.jpg) 0% 0% no-repeat fixed; min-height: 1000px !important; 
    height: 1000px !important; 
    margin: 0 auto !important; 
    width: 100%; 
    max-width: 1920px !important; 
    position: relative !important; 
    background-size:cover !important; 
    -webkit-background-size: cover; 

} 

Шахта работает с этим ..

Смежные вопросы