當使用響應式設計時,是否有辦法仍然允許用戶查看完整網站?響應式設計:允許用戶也查看完整網站
E.g.他們在iPhone上查看,但希望看到完整的網站。他們點擊「完整網站」鏈接,並向他們展示1024像素版本。
當使用響應式設計時,是否有辦法仍然允許用戶查看完整網站?響應式設計:允許用戶也查看完整網站
E.g.他們在iPhone上查看,但希望看到完整的網站。他們點擊「完整網站」鏈接,並向他們展示1024像素版本。
如果您正在使用媒體查詢,請僅在具有「響應式」類的正文元素下應用規則。
@media screen and (max-width: 320px) {
body.responsive {
color: blue;
}
}
如果用戶不想要查看的響應式佈局,只需從主體元素刪除「響應」類中,抵消了所有規則。您也可以通過Cookie或其他方法堅持用戶偏好。
演示:http://jsbin.com/obaquq/edit#javascript,html
減少窗口不超過500像素會變成白色的文字,背景爲藍色。這是以身體具有「響應」級別爲條件的。點擊第一段會切換這個類,從而切換媒體查詢本身的效果。
還沒有嘗試過,但自己想過這個問題。我想你可以使用樣式表切換器來關閉核心響應式樣式表,留下完整版本的用戶切換樣式表當然不是一個新概念。這裏有一篇關於ALA大約在2001年處理切換樣式表的文章:http://www.alistapart.com/articles/alternate/
我一直在想這件事。我已經成功使用jQuery來修改視口標記,從目前爲止我可以看出,它似乎工作得很好。不需要多個樣式表或大量額外的CSS。
這是一個完美的答案。那麼,你是否在說我應該使用類似jQuery的東西來查看它是否是移動設備,然後添加響應式類?或者換一種方式呢? – 2012-04-11 19:52:11
@NicHubbard默認情況下,我會默認啓動一個響應站點,意思是在默認情況下在body上加載'responsive'類。人們選擇退出響應式體驗。 – Sampson 2012-04-11 19:53:40
@NicHubbard然後使用你的媒體查詢只顯示小屏幕上的「完整網站」鏈接,鏈接刪除了「響應」類 – 2012-04-11 20:01:42