【发布时间】:2011-01-11 22:11:19
【问题描述】:
我正在使用 javascript 函数根据用户屏幕分辨率使用 onload 事件重置 3 个 DIV 的样式。
if(screen.width > 1024 && screen.width < 1300){
document.getElementById('wrapper').style.width = '1250px';
document.getElementById('innerwrapper').style.width = '1250px';
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1250px';
}
if(screen.width > 1300 && screen.width < 1500){
document.getElementById('wrapper').style.width = '1350px';
document.getElementById('innerwrapper').style.width = '1350px';
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1350px';
}
if(screen.width > 1500){
document.getElementById('wrapper').style.width = '1580px';
document.getElementById('innerwrapper').style.width = '1580px';
var elms = getElementsByClassName("colmask", "div")[0].style.width = '1580px';
}
问题是每次用户导航到新页面时,屏幕都会在加载页面后自行调整大小。有没有办法避免一直调整页面大小?
【问题讨论】:
-
如果你原谅我的直率和判断力,这是一个糟糕的主意。不要使用固定宽度的布局,尤其是与像素值相关的布局。 (有一个有效的论据可以在列中显示大量散文,其宽度根据字体大小固定,以保护用户免受自己的伤害并以固定的行长为目标。)制作适用于屏幕的动态布局以及具有不同分辨率和 dpi 的设备。
-
我同意,仅仅因为他们的分辨率支持页面宽度并不意味着他们的浏览器全屏。用户将不得不让他们的浏览器足够大以仅根据他们的屏幕分辨率来适应内容。
-
如果您坚持这样做,则通过 AJAX 或表单将宽度/高度发送回服务器,并让客户端输出带有大小值的 css。这应该会强制页面自动以适当的大小呈现,而不必“弹出”到位。
-
@Shahid - 此代码在您的 HTML 中的什么位置?
-
@Phrogz, Soviut:我完全同意你的看法。但是,即使我已经解释过,这个特定的客户仍然坚持要完全做到这一点。
标签: javascript resize resolution