Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[展示] 渴切进入网页宽屏时代~附discuz响应式解决方案

[复制链接]
psd2html 发表于 2013-12-30 20:41:59 | 显示全部楼层 |阅读模式
渴切开源css框架官网采用discuz驱动,之所以采用discuz论坛来搭建这个平台有两个原因:其一是discuz确实是一款优秀的开源程序;其二是因为渴切想基于discuz来初略统计使用者的人数(所以下载渴切css框架需要注册并且回复也是出于这个目的),以及通过渴切css基础来建立一个纯干货的css分享平台。
现在宣布进入网页宽屏时代。渴切官网基于discuz驱动,采用渴切css框架(kr.js)添加了论坛的响应式支持,完美支持宽屏窄屏,并且响应支持ie浏览器。

在discuz程序中找到 static/js/common.js  在文件末尾添加如下代码:
  1. /*ie响应式支持*/
  2.     if(BROWSER.ie) {
  3.     if(window.screen.width > 1250 && window.screen.width < 1600){
  4.     document.getElementsByTagName('html')[0].className = 'w1200';
  5.     }
  6.     else if(window.screen.width < 1200){
  7.     document.getElementsByTagName('html')[0].className = 'w960';
  8.     }
  9.     }
复制代码
找到 template/default/common/common.css 在文件末尾添加如下代码:
  1. @media (min-width: 1250px) and (max-width: 1440px) {
  2.     .wp{ width: 1200px; }

  3.     }
  4.     .w1200 .wp{ width: 1200px; }
  5.     @media (min-width: 980px) and (max-width: 1300px) {
  6.     .wp{ width: 960px; }

  7.     }
复制代码
然后进入后台更新一下缓存,在刷新网页看看是否能够响应呢。

转载:http://www.keqie.com/thread-9524-1-1.html

Dz新手帮助站 发表于 2014-7-15 21:09:34 | 显示全部楼层
希望你网站用上它
回复

使用道具 举报

宝塔脚下打倩倩 发表于 2014-7-15 21:10:51 | 显示全部楼层
这是真的吗?太好了,谢谢您啊
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2024-11-17 00:49 , Processed in 0.028199 second(s), 6 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表