我正在尝试在iOS上为学校项目提供固定背景图像div.我一直在用
background-attachment: fixed;
Run Code Online (Sandbox Code Playgroud)
但这导致了移动游猎中的奇怪尺寸和滚动效果.这是我正在使用的网站 ; 我目前用于引用div图像背景的方法在桌面上运行良好但在iOS上完全失败.
不知何故,http: //www.everyonedeservesgreatdesign.com 得到了这个工作.我在跟踪代码时遇到了困难,因为他们正在使用某种类型的方形空间模板,但看起来他们正在将图像放入一个position:fixed
以某种方式被position:relative
其父div 剪切的div中.我的印象是不可能position:fixed
用视口以外的任何东西来剪切div,所以我很好奇这里发生了什么.
关于如何在我的网站中为固定图像div背景实现此方法的任何想法?
我有问题background-image
.我的网站在Android设备上看起来不错,然后我发现iPhone和iPad不喜欢background-size: cover
.
我通过设置修复了这个background-size: 100%
.
在网络上的iPhone模拟器上,该网站看起来很不错,但只要在真实的iPhone(iOS 9.3)上测试该网站,就不会显示背景图像.
标题图像加载,此图像用作网站上的背景,它也显示在那里.唯一加载的背景正上方的另一个图像开始加载,但似乎由于某种原因中止.
图像的大小为:1920x1080.
网站:http://www.unterwasserfotografie-thomas-uhl.de/
更新:
我从下面尝试过Aziz的解决方案.使用背景大小:自动100%使智能手机上的图像看起来更好,但它们不会加载到移动苹果设备上.但是,如果设置了background-size:cover,所有背景都会被加载,问题是,只显示图像的一小部分(图像的右上角?!),这部分非常模糊(看起来像放大).由于我没有改变任何设置背景大小:覆盖到背景大小:100%自动,我不敢相信,图像相互堆叠.
目前我已经设置了背景大小:再次100%,这在桌面设备上看起来最好,到目前为止移动设备还可以,只要背景没有正确加载,我就不会开始担心布局了.
据我所知,这样的背景下,大小:100%的汽车是不是为背景的最好的方式,将definetly考虑解决方案1.我不明白的是,为什么只有在所有被加载一个背景,在iPhone上加载网站的时候.background-position:center是否只是将所有背景堆叠在屏幕上的相同位置,这样我才能看到已加载的最新背景?请记住:网站上总共有大约6个背景,但只显示其中一个背景,也就是在标题中使用其图像的背景.
感谢您的支持到目前为止,我将为这个问题设置一个赏金,因为我真的对这个问题感到绝望.