如何检测浏览器何时太小，然后告诉访问者放大浏览器继续？

Question

是否可以创建一个jquery脚本，可以检测浏览器何时变小，然后告诉访问者放大浏览器继续？

有人知道jquery脚本吗？

Answer 1

当他们的浏览器最大化然后它仍然太小时呢？

他们是否必须不断处理这条消息？

以下是一个示例脚本：

if( window.clientWidth < 1000 ){ 
 alert("Send your business elsewhere"); 
} 

这种强制用户调整大小的想法似乎过于具有侵略性，无论如何使用，因为用户应该确定他们的窗口大小。响应式设计是为用户塑造视图，而不是将用户塑造成您的视图。

Answer 2

每个人都对这样做的有效性提出了很好的观点。但是 -

var tooSmall = 500;
var wHeight = $(window).height();
var wWidth = $(window).width();
if ( wWidth < tooSmall ){
    //Tell them so!
} 

Answer 3

使用jQuery是可能的，就像这样。

if($(window).width() < 960) {
    // Do something when less than 960
}

或纯JavaScript

if(document.width < 960) {
    // Do something when less than 960
}

替代CSS解决方案

由于您没有提供任何上下文，很难说出最佳解决方案是什么，但另一种选择是使用CSS media queries并在窗口低于某个宽度时显示消息。

关于这一点的好处是你不必担心监听窗口调整大小事件等。也要跟踪当前的屏幕大小。浏览器会为您处理。如果你在监听窗口大小调整事件的道路上，它也可能比JS解决方案更有效。此外，还将处理用户禁用JavaScript的情况。

标记：

<div id="error-message">Please enlarge your window for the site to work</div>

CSS：

#error-message {
   display: none;
}

@media only screen and (max-width: 960px) {
   #error-message {
        display: block;
   }
}