【问题标题】:Javascript screen resolution reset on load加载时重置 Javascript 屏幕分辨率
【发布时间】: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


【解决方案1】:

我同意上面的 cmets,如果您决定使用 Jquery,根据浏览器的大小使其动态化非常容易

您所要做的就是var wcontent=$(window).width();

$("#wrapper").width(wcontent);

等等

你可以把它放在$(document).ready(function () {}

【讨论】:

  • 我没有使用 jquery,但这不等同于我已经在做的事情吗?
  • 我昨天在所有其他 cmets 之前写了关于固定 div 大小的内容,并且通过这种方式,当用户导航到新页面时它不会调整大小。它显然是一样的只是管理好一点
猜你喜欢
  • 2017-01-12
  • 1970-01-01
  • 1970-01-01
  • 2016-06-28
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多