根据当前设备的宽度,动态计算出rem的换算比例,实现页面中元素的等比缩放
~function anonymous(window){
//根据当前设备的宽度,动态计算出rem的换算比例,实现页面中元素的等比缩放
let computedREM = function computedREM(){
let winW = document.documentElement.clientWidth,
desW = 640;
if(winW>640){
document.documentElement.style.fontSize = '100px';
return;
}
document.documentElement.style.fontSize = winW/desW * 100 +'px';
};
computedEEM();
window.addEventListener('resize',computedREM);
}(window);
根据当前设备的宽度,动态计算出rem的换算比例,实现页面中元素的等比缩放的更多相关文章
- javascript动态改变当前页面中元素的状态行为
function Datea() { var timed = document.getElementById('timed'); var t = setInterval(function TDate( ...
- 动态计算Label高度
//1.设置该label的numberOfLines为0 self.titleLabel.numberOfLines = 0; //2.字体的设置要与之前相同 NSDictionary * at ...
- ES6 动态计算属性名
在ES5之前,如果属性名是个变量或者需要动态计算,则只能通过 对象.[变量名] 的方式去访问. <script type="text/javascript"> var ...
- 小程序和Vue利用swiper实现icons分页显示--动态计算
这里发现小程序实现步骤,Vue与之类似 先上效果图: <view class="icons"> <swiper indicator-dots="true ...
- 第148天:js+rem动态计算font-size的大小,适配各种手机设备
需求: 在不同的移动终端设备中实现,UI设计稿的等比例适配. 方案: 布局排版都用rem做单位,然后不同宽度的屏,js动态计算根节点的font-size. 假设设计稿是宽750px来做的,书写css方 ...
- css清浮动与动态计算元素宽度
css常用清浮动写法 /*清除浮动*/| .clears:after{ display: block; content: ''; clear: both; height: ; visibility: ...
- iOS 动态计算文本内容的高度
关于ios 下动态计算文本内容的高度,经过查阅和网上搜素,现在看到的有以下几种方法: 1. // 获取字符串的大小 ios6 - (CGSize)getStringRect_:(NSString* ...
- 理解rem实现响应式布局原理及js动态计算rem
前言 移动端布局中,童鞋们会使用到rem作为css单位进行不同手机屏幕大小上的适配.那么来讲讲rem在其中起的作用和如何动态设置rem的值. 1.什么是rem rem是相对于根元素(html标签)的字 ...
- iOS中动态计算不同颜色、字体的文字高度
在改项目bug的时候,有一个问题动态计算label的高度,前开发者竟然用字符串长度除以14.16这样的常量来计算是否换行,结果cell的高度问题非常严重. 因为label内容里有部分关键字是要另一种颜 ...
随机推荐
- AI 预测蛋白质结构「GitHub 热点速览 v.21.29」
作者:HelloGitHub-小鱼干 虽然 AI 领域藏龙卧虎,但是本周预测蛋白质结构的 alphafold 一开源出来就刷爆了朋友圈,虽然项目与我无关,但是看着科技进步能探寻到生命机理,吃瓜群众也有 ...
- C语言:extern应用
前面我们都是将所有的代码写到一个源文件里面,对于小程序,代码不过几百行,这或许无可厚非,但当程序膨胀代码到几千行甚至上万行后,就应该考虑将代码分散到多个文件中,否则代码的阅读和维护将成为一件痛苦的事情 ...
- 【012】JavaSE面试题(十二):多线程(2)
第一期:Java面试 - 100题,梳理各大网站优秀面试题.大家可以跟着我一起来刷刷Java理论知识 [012] - JavaSE面试题(十二):多线程(2) 第1问:多线程的创建方式? 方式一:继承 ...
- 2018年成为Web开发者的路线图
本文通过一组大图展示了Web开发技能图谱,给出了作为Web 开发者可以采取的路径,以及总结了想要成为Web工程师的朋友们.希望和大家一起交流分享 介绍 Web 开发的角色一般说来,包括前端.后端和de ...
- python基础之面向对象OOP
#类(面向对象) PageObject设计模式 unittest 知识体系#函数式编程import datetimebook_info = { "title":"Pyth ...
- Appium和Python实现蚂蚁森林自动化收取能量
准备环境 Window10系统 Appium1.21.0 AndroidSDK r24.1.1 Python3.7.5 支付宝apk文件 查看支付宝apk包信息 使用android sdk aapt命 ...
- React中组件之间通信的方式
一.是什么 我们将组件间通信可以拆分为两个词: 组件 通信 回顾Vue系列的文章,组件是vue中最强大的功能之一,同样组件化是React的核心思想 相比vue,React的组件更加灵活和多样,按照不同 ...
- 用Nextcloud在树莓派上布置你的个人网盘“NAS”
用Nextcloud在树莓派上布置你的个人网盘"NAS" 这次用的是目前最新的 Raspbian Stretch 系统,基于 Debian 9. 软件程序是 Nextcloud 1 ...
- rJava在ubuntu上的安装
1.Oracle JDK 8(必须装oracle的,open的不行) http://www.cnblogs.com/loca/p/4679110.html Install Oracle JDK 8 o ...
- 简单快速安装Apache+PHP+MySql服务环境(四)—— 将php版本升级到7.2
书接上文,简单快速安装Apache+PHP+MySql服务环境(二)-- centos使用yum安装指定版本的php. 随着各种PHP框架的升级,对PHP的版本也有了更高的要求,所以笔者也尝试着更新升 ...