jquery - 在具有特定视口(viewport)(例如低于 320 像素)的设备上显示完整(桌面 View )网站？

Question

我一直在完成一个完全响应式网站(使用 Bootstrap 3 框架)的工作，最近客户询问是否可以在较小的设备(例如，低于 320 像素)。由于我以前从未遇到过这样的要求，我想知道是否有任何合法的解决方法，例如在头部放置一个额外的视口(viewport)元标记，如下所示:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=1024, user-scalable = yes" media="screen and (max-width:      319px)">  

如果有任何已知的(合法的)方法来实现这一点(无论是在 JS/jQuery 还是 CSS 中)，我很乐意了解您对此的想法。

谢谢!

Answer 1

嗯，我必须为此找到解决方案，因为我的客户一直坚持。所以我使用了一小段 JavaScript/jQuery 来更改“视口(viewport)”元的内容。在这里:

var myViewport = document.querySelector("meta[name=viewport]");

    if ($(window).width() < 320){
    myViewport.setAttribute("content", "width=1024; user-scalable = yes");
    } else {
    myViewport.setAttribute("content", "width=device-width; initial-scale = 1.0");
} 

实际上，我不知道这有多合法，但它有效，我决定回答我自己的问题，以防你们中的任何人将来遇到这个奇怪的要求。