Question

我最近开始使用自适应属性编写布局代码。我个人讨厌移动网站，但为了容纳我的访问者，我决定让我的网站响应。

我想知道的是如何在我想要的时候禁用响应属性。

我想在页面顶部找到一个链接，点击该链接可以打开/关闭移动网站。

可以这样做吗？

谢谢！

Answer 1

首先想到的是一个JavaScript（/ jQuery）函数，当交换机是这样或那样时，它可以从HTML布局中添加或删除CSS文件。您必须创建一个仅包含响应式媒体查询的单独CSS文件，但这不应该是一个大问题。

Answer 2

如果您使用的是服务器端语言，一种方法是为想要查看完整网站的查看者提供包含查询信息的链接，例如http://mywebsite.com/?full=1。您将检查查询数据中是否存在变量full并检查其1是否存在。如果是，则将相关的full会话变量设置为true。然后，无论何时加载页面，检查会话变量full是否为真。如果是，则提供“Full CSS”文件。如果不是，请提供“响应式CSS”文件。您可以使用cookie而不是我认为的会话变量。我在服务器端部门有点生疏。

您也可以使用Cookie在JavaScript中执行此操作。

Answer 3

我认为最简单的方法是将样式表的响应部分放在单独的文件中，例如responsive.css。然后，您可以将javascript函数绑定到切换该样式表的链接：

在<head>：

中

<link rel="stylesheet" href="responsive.css" id="responsiveStyle">

在<body>：

中

<a href="javascript:toggleResponsive()">Toggle</a>

使用Javascript：

function toggleResponsive() {
   var responsiveStyle = document.getElementById('responsiveStyle');
   if(responsiveStyle.rel === "stylesheet") {
      responsiveStyle.rel = "";
   } else {
       responsiveStyle.rel = "stylesheet";
   } 
}

绕过响应式设计

3 个答案: