我的网站在桌面浏览器上运行良好,但在移动设备(iOS、Android 等)上,它会在我放大或缩小时重新加载背景并似乎刷新整个页面。我想知道是什么原因造成的,但到目前为止,我一直无法找到问题的原因。它使移动浏览非常烦人。
所有的 CSS 和 JavaScript 文件都应该链接到我的页面的源代码中。什么可能导致此问题?
我的网站在桌面浏览器上运行良好,但在移动设备(iOS、Android 等)上,它会在我放大或缩小时重新加载背景并似乎刷新整个页面。我想知道是什么原因造成的,但到目前为止,我一直无法找到问题的原因。它使移动浏览非常烦人。
所有的 CSS 和 JavaScript 文件都应该链接到我的页面的源代码中。什么可能导致此问题?
刚刚检查了我的 iPhone,我明白你在说什么,但是我没有看到页面重新加载本身,它可能只是重新加载 CSS 以调整到新的大小。
如果您尝试启用轻松的移动查看,您应该创建一个移动样式表并使用 javascript 和 php 来更改 css 样式表。
我能够解决这个问题。问题出在以下 CSS 中:
body
{
background-color:black;
}
div.back3
{
background-image:url("back.png");
position:fixed;
z-index:-1;
margin-left:-2%;
margin-top:-100%;
padding:0;
height:400%;
width:104%;
}
div.back2
{
background-image:url("back.png");
background-position:250px 250px;
position:fixed;
z-index:-1;
margin-left:-2%;
margin-top:-28%;
padding:0;
height:400%;
width:104%;
}
div.main
{
position:static;
}
我不确定到底是哪一部分导致了问题,我会做更多的挖掘,但现在我只是使用以下内容来指定这个 CSS 样式表只能在非移动设备上使用:
<link rel='stylesheet' href='/z/styles/main-style.css' media='screen and (min-device-width:770px)'>
min-device-width 属性设置为那个高的数字,以确保 iPad 也不使用此样式表(尽管如果机器接近 iPad 尺寸,我可能会遇到问题,但此样式表不是超级关键无论如何,我的网站的操作)。
谢谢!编辑:特别感谢 Andrew Manson 建议仅针对移动设备禁用样式表。