2017-09-13 84 views
0

我知道这已被回答,但我希望有人向我展示如何在移动设备和平板电脑视图上禁用我的特定代码。 每当我使用视差,然后在手机或平板电脑上查看我的网站时,它都会将图像放大到根本无法辨认的位置。我怎样才能避免这种情况? 谢谢。如何禁用移动设备和平板电脑视图上的视差?

.parallax { 
 
    height: 800px; 
 
    width: 100%; 
 
    background-attachment: fixed; 
 
    background-position: 50% 50%; 
 
    background-repeat: no-repeat; 
 
    background-size: cover; 
 
}
<div class="parallax" style="background-image: url('https://s3.amazonaws.com/media.ohi/15678_vegancooking_2o.jpg');"> 
 
    <p class="photog" style="color:#FFF;">name here</p> 
 
</div>

回答

0

试试这个

@media only screen and (max-width:749px) { 
    .parallax { 
    background-attachment: scroll; 
    background-size: 100% 100%; 
    } 
} 

样品fiddle ..

+0

这没有奏效,图片在移动视图上仍然很放大。 – johnstont05

+0

你是什么意思? – johnstont05

+0

我的意思是背景大小..看看这[小提琴](https://jsfiddle.net/wcv7s1b7/2/).. –

2

试试这个

@media only screen and (max-width:749px) { 
    .parallax { 
    background-attachment: inherit; 
    } 
} 

只是RES et移动背景附件。

相关问题