0

我最近开始使用响应属性编写我的布局。我个人讨厌移动网站,但为了适应我的访问者,我决定让我的网站具有响应性。

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

我想在我的页面顶部有一个链接,单击该链接将打开/关闭移动网站。

这可以做到吗?

谢谢!

4

3 回答 3

3

首先想到的是一个 JavaScript (/jQuery) 函数,当切换为单向或另一向时,该函数可从 HTML 布局中添加或删除 CSS 文件。您必须制作一个单独的 CSS 文件,其中仅包含您的响应式媒体查询,但这应该不是什么大问题。

于 2013-09-30T09:01:43.697 回答
1

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

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

于 2013-09-30T09:08:25.977 回答
1

我认为最简单的方法是将样式表的响应部分放在一个单独的文件中,例如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";
   } 
}
于 2013-09-30T09:11:10.867 回答