建站百科

网站建设、网站设计、网站开发、域名、主机、服务器等知识普及

简易js实现flexible.js手机端适配效果

文章导读:本文主要阐述了“简易js实现flexible.js手机端适配效果”下面介绍端简易js实现flexible.js手机端适配效果,flexible是淘宝出的一个解决移动端页面适配不同手机屏幕的js,直到现在它仍然...,本文由跨屏网最后更新于2020-07-23,全文共820个字,预计阅读时长2分44秒

 下面介绍端简易js实现flexible.js手机端适配效果,flexible是淘宝出的一个解决移动端页面适配不同手机屏幕的js,直到现在它仍然好用,它的实现原理也很简单。
<meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" /> <meta name="format-detection" content="telephone=yes" /> <meta name="msapplication-tap-highlight" content="no" /> <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> 
//CSS里使用rem代替px,JS里根据屏幕大小修改rem的值 window.setFontSize = function() { var size = document.documentElement.clientWidth / 750 * 100; // size = size > 50 ? size : 50 // console.log(size); document.documentElement.style.fontSize = size.toString() + "px"; }; setFontSize(); //在屏幕大小变化时重新设置大小 $(window).resize(function() { setFontSize() });

写在最后,以上就是对于“简易js实现flexible.js手机端适配效果”的一些看法,欢迎指正、交流。

网页信息:简易js实现flexible.js手机端适配效果
标题URL:http://test.kuaping.com/article/show135.html

推荐模板
紫色大气教育培训模板
编号:partf#zisejiaoyu
游戏电影适用深蓝色网站模板
编号:partf#gamedianying
医生科研生物网站带时间轴模板
编号:partf#daishijianzhou
学习教育培训类模板
编号:partf#jiaoyuedu
网站即将上线引导页
编号:partf#shangxianyindao
免责声明:本站是自助建站平台,仅提供信息存储空间服务,该信息内容的真实性及合法性由该发布者完全负责。
咨询客服

8年品牌 专注移动电商

扫码立即咨询

027-817-77732

133-434-77732

关注我们

关注跨屏互联公众号

回到顶部