<分区>
要求提供代码的问题必须表现出对所解决问题的最低限度理解。包括尝试过的解决方案、为什么它们不起作用,以及预期结果。另请参阅:Stack Overflow question checklist
关闭 9 年前。
<分区>
要求提供代码的问题必须表现出对所解决问题的最低限度理解。包括尝试过的解决方案、为什么它们不起作用,以及预期结果。另请参阅:Stack Overflow question checklist
关闭 9 年前。
当使用媒体查询创建一个“响应式”
网站时,我如何才能有一个按钮来查看布局的“完整”/桌面版本?例如:
mobile wikipedia desktop wikipedia
我可以看到他们显然在使用 M 子域,这不是我想要的。我只是希望能够单击一个链接并让网站认为浏览器不适合移动宽度,直到 cookie 过期或其他什么。
我想过有没有可能用js去掉css文件,再加载一个?
你是怎么解决的
最佳答案
Javascript 可能是这里的一个选项 - 使用类似的东西:
function getURLParameter(name){
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.search)||[,""])[1].replace(/\+/g, '%20'))||null;
};
var version=getURLParameter('version');
var headHTML = document.getElementsByTagName('head')[0].innerHTML;
switch(version){
case 'mobile':
headHTML += '<link type="text/css" rel="stylesheet" href="style.css" media="only screen and (max-device-width: 480px)">';
break;
case 'desktop':
headHTML += '<link type="text/css" rel="stylesheet" href="style.css" media="only screen and (max-device-width: 1040px)">';
break;
default:
headHTML += '<link type="text/css" rel="stylesheet" href="style.css" >';
break;
}
version && document.getElementsByTagName('head')[0].innerHTML = headHTML;
然后,各种版本的链接将附加 GET 变量 version=desktop
等,并且只会加载相关的 CSS。
清楚地-适本地更改样式表包含中的媒体属性。
关于javascript - 有一个通过媒体查询查看 'non-mobile layout' 的按钮吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19980902/