javascript - swiper配合rem,以及rem插件出线的宽度被改变的问题
怪我咯
怪我咯 2017-04-11 11:16:44
0
3
630

swiper跟rem出线的一个稀奇古怪的问题
我的网页代码如下,无论是给swiper-wrapper加宽高,加overfllow:hidden都不行。研究了一晚上-。-好菜啊我

          
  

rem这个插件的代码如下:

(function (doc, win) { var docEl = doc.documentElement, resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize', recalc = function () { var clientWidth = docEl.clientWidth; if (!clientWidth) return; if (clientWidth >= 640) { docEl.style.fontSize = '100px'; } else { docEl.style.fontSize = 100 * (clientWidth / 640) + 'px'; } }; if (!doc.addEventListener) return; win.addEventListener(resizeEvt, recalc, false); doc.addEventListener('DOMContentLoaded', recalc, false); })(document, window);

理论上每个p的宽度为640px,但是却变得非常的小,如下图所示,大约每个100多px,这是为何。

怪我咯
怪我咯

走同样的路,发现不同的人生

membalas semua (3)
黄舟

把rem.js去掉看看是不是元素宽度一样?说明页面进来后rem没有起作用,看下rem什么时候执行:

想到原因了没?还没有?网页默认rem是多少?1rem = 16px,那么你写的p宽度为6.4rem算出来是多少px?再用模拟器看下和16*6.4一样不?那为啥html标签上显示了当前的font-size,但是rem却不正确呢?

原理看这里,有点长不过值得看

    巴扎黑

    你好,我现在在弄微信的一个项目也遇到rem'和swiper的问题了,想问下这个问题你解决了吗。

      伊谢尔伦

      不太清楚楼主的rem基础值(fontsize)为什么那么算,rem本身根据根元素的字体大小去计算,而这个值需要根据不同的屏幕去人为的改变,我是利用js去算的,根元素font-size大小等于浏览器宽度/20,具体可以参考利用CSS3新单位rem实现响应

        Muat turun terkini
        Lagi>
        kesan web
        Kod sumber laman web
        Bahan laman web
        Templat hujung hadapan
        Tentang kita Penafian Sitemap
        Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!