为Drupal的Bootstrap主题添加Respond.js增强对IE浏览器的兼容性

cn4jd的头像

JD译站使用Bootstrap基主题后,一直没怎么关注过统计中的浏览器使用情况,最近查看后,发现IE8浏览器的访客还是不少,于是自己用IE8访问了自己的网站,不访问不知道,一访问,吓一跳,这还是个网站么?这么错乱!

于是查看下Bootstrap浏览器支持情况,Internet Explorer 8 需要Respond.js配合才能实现对媒体查询(media query)的支持,按照文档说明,马上搜索drupal中的repond.js使用情况,发现Drupal 一般被配置为通过 @import 引入CSS文件,Respond.js对其将无法起到作用。还好有drupal的repond.js模块来解决这个问题,安装步骤如下:

1、下载repond.js模块

2、安装Libraries API,并在site/all下新建libraries目录,另外在libraries目录下需新建repondjs文件夹

3、启用repond.js模块,并将repond.js模块下lib文件夹下的respond.min.js文件移至libraries文件夹下的repondjs目录(此步骤可选操作,默认情况下repond.js模块已启用repond.js,但在状态报告中会报错),并确定网站的“性能”-“带宽优化”中“合并和压缩CSS文件”已勾选。

4、用IE8、9再测试下你的Bootstrap主题网站,页面是不是不再错乱,已经恢复正常了?

至于兼容IE6、7你可以参考鄙视IE中的用法,JD译站是不打算兼容他们了!

作者: 
cn4jd

评论

JamesYin的头像
JamesYin

我压根就没打算过兼容IE,我个人觉得还在使用IE的人实在太懒了,他们不会对我网站的内容感兴趣。
另,贵站的排版有点乱,看得我有种想黑进去重新排版的冲动,开个玩笑~

2014-1-27/11:02:05
cn4jd的头像
cn4jd

嗯,排版确实有些问题,准备做调整,可否给点建议?

2014-1-27/13:38:00
JamesYin的头像
JamesYin

我也没啥好建议的,我只会Bootstrap,但我看Foundation挺高端大气上档气的,要不试试:http://foundation.zurb.com/

2014-1-27/14:55:23
cn4jd的头像
cn4jd

那个drupal的主题节奏跟不上,都到foundation5了,drupal的foundation4基主题都没搞定,先仔细研究好bootstrap再说,只是排版上再学习下

2014-1-27/16:49:57
JamesYin的头像
JamesYin

个人觉得Bootstrap的功能弱了点,就是学起来挺容易

2014-1-27/17:01:37
cn4jd的头像
cn4jd

呵呵,我觉得够用就行,毕竟省了不少工作量

2014-1-27/23:40:41
烽行天下的头像
烽行天下
还是不正常的,你自己用IE打开看看
2015-9-22/17:18:08
cn4jd的头像
cn4jd

请问你的是ie几?还有你的bootstrap版本是多少?

2015-12-2/14:09:39
烽行天下的头像
烽行天下
用IE8打开你的网站,没有色彩
2015-12-4/9:18:40
cn4jd的头像
cn4jd

刚装ITtester试了下,确实有这问题,不过不管他了,到时候要改下版

2015-12-4/21:07:26

添加新评论