响应式设计：允许用户也查看完整网站

当使用响应式设计时，是否有办法仍然允许用户查看完整网站？响应式设计：允许用户也查看完整网站

E.g.他们在iPhone上查看，但希望看到完整的网站。他们点击“完整网站”链接，并向他们展示1024像素版本。

如果您正在使用媒体查询，请仅在具有“响应式”类的正文元素下应用规则。

@media screen and (max-width: 320px) { 
    body.responsive { 
    color: blue; 
    } 
}

如果用户不想要查看的响应式布局，只需从主体元素删除“响应”类中，抵消了所有规则。您也可以通过Cookie或其他方法坚持用户偏好。

减少窗口不超过500像素会变成白色的文字，背景为蓝色。这是以身体具有“响应”级别为条件的。点击第一段会切换这个类，从而切换媒体查询本身的效果。

2012-04-11 19:41:08 Sampson

这是一个完美的答案。那么，你是否在说我应该使用类似jQuery的东西来查看它是否是移动设备，然后添加响应式类？或者换一种方式呢？ – 2012-04-11 19:52:11

@NicHubbard默认情况下，我会默认启动一个响应站点，意思是在默认情况下在body上加载'responsive'类。人们选择退出响应式体验。 – Sampson 2012-04-11 19:53:40

@NicHubbard然后使用你的媒体查询只显示小屏幕上的“完整网站”链接，链接删除了“响应”类 – 2012-04-11 20:01:42

还没有尝试过，但自己想过这个问题。我想你可以使用样式表切换器来关闭核心响应式样式表，留下完整版本的用户切换样式表当然不是一个新概念。这里有一篇关于ALA大约在2001年处理切换样式表的文章：http://www.alistapart.com/articles/alternate/

2012-04-11 19:42:32 ckaufman

我一直在想这件事。我已经成功使用jQuery来修改视口标记，从目前为止我可以看出，它似乎工作得很好。不需要多个样式表或大量额外的CSS。

2012-04-12 19:36:50

回答