在页面rem布局中用到的js代码
在你的页面加入以下代码,就初步搞定了
function fontSize() {
var view_width = document.getElementsByTagName('html')[0].getBoundingClientRect().width;
var _html = document.getElementsByTagName('html')[0];
view_width > 768 ? _html.style.fontSize = 100 * 768 / 375 + 'px' : _html.style.fontSize = view_width * 100 / 375 + 'px';
}
fontSize();
window.onresize = function() {
fontSize();
}
让一个页面充满屏幕,加入以下代码
var htmlHeigt=window.innerHeight;
var rebate_home=document.getElementsByClassName('rebate_home')[0].clientHeight;
this.offset={
height:(htmlHeigt-rebate_home)+'px',
background:'#eff0f4'
}
this.offset=htmlHeigt>rebate_home?{
height:htmlHeigt+'px'
}:{
height:rebate_home+'px'
}
在页面rem布局中用到的js代码的更多相关文章
- 如何在一个网站或者一个页面,去书写你的JS代码
// JavaScript Document //如何在一个网站或者一个页面,去书写你的JS代码: //1.js的分层(功能) : jquery(tools) 组件(ui) 应用(app), mvc( ...
- 手机页面rem布局
手机页面设计一般的大小是640,但是,手机屏幕大小确实不确定的,这样,怎么才能做出适应所有手机的手机页面呢?一般的解决方案有两种,rem布局和百分比布局,更推荐用rem布局来制作手机页面. 首先,给页 ...
- H5 页面 rem 布局适配方法
rem 布局适配方案 主要方法为: 按照设计稿与设备宽度的比例,动态计算并设置 html 根标签的 font-size 大小: css 中,设计稿元素的宽.高.相对位置等取值,按照同等比例换算为 re ...
- 刷新页面后,让控制台的js代码继续执行
在各种限时,秒杀活动中,有个自动循环的点击的工具是很重要的. 为了方便起见,我们把Js代码放在浏览器的控制台执行,但是刷新页面后,js代码就清空了,也就无法执行. 可以用js代码实现一个不受页面刷新影 ...
- 在div+css中用到的js代码注意return
今天做了一个项目,美工做好后放在了form中(没有加runat=server),由于用到了服务器控件,所以这里要加,否则报错,关键一段div代码是: <form id="form_re ...
- 响应式布局(rem布局),使用JS动态设置fontsize
var cw = document.documentElement.clientWidth; if (cw > 1920) { cw = 1920; } document.getElements ...
- 细说移动端 经典的REM布局 与 新秀VW布局
和以往一样,本次项目也放到了 Github 中,欢迎围观 star ~ 1. 前言 2. 基本概念 3. REM布局 4. VW布局 实现单边边框1px 实现多边边框1px 实现边框圆角 实现容器固定 ...
- 移动端开发rem布局之less+媒体查询布局的原理步骤和心得
rem即是以html文件中font-size的大小的倍数rem布局的原理:通过媒体查询设置不同屏幕宽度下的html的font-size大小,然后在css布局时用rem单位取代px,从而实现页面元素大小 ...
- yii2 如何在页面底部加载css和js
作者:白狼 出处:www.manks.top/article/yii2_load_js_css_in_end 本文版权归作者,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接 ...
随机推荐
- 老男孩Day3作业:工资管理系统
作业需求: 1.从info.txt文件中读取员工及其工资信息,最后将修改或增加的员工工资信息也写入原info.txt文件. 2.能增查改员工工资 3.增.改员工工资用空格分隔 4.实现退出功能 1)编 ...
- 《图解HTTP》阅读笔记--第七章---确保WEB安全的HTTPS
第七章.确保WEB安全的HTTPSHTTP的缺点:通信使用明文(不加密),内容可能会被窃听 解决---加密处理: //将通信加密 :通过SSL(安全套接层)---HTTPS(超文本传输安全协议)--- ...
- CF1096G Lucky Tickets 快速幂套FFT
\(\color{#0066ff}{ 题目描述 }\) 一个\(n\)位数,每位可以是给出的\(k\)个数码中的一个数,可以有前导\(0\),输出前\(n/2\)位之和与后\(n/2\)位之和相等的方 ...
- 「洛谷P3768」简单的数学题 莫比乌斯反演+杜教筛
题目链接 简单的数学题 题目描述 输入一个整数n和一个整数p,你需要求出 \[\sum_{i=1}^n\sum_{j=1}^n (i\cdot j\cdot gcd(i,j))\ mod\ p\] ...
- 最长回文串:LeetCode:Longest Palindromic Substring
class Solution { public: string longestPalindrome(string s) { int length=s.length(); ; ; ][]={false} ...
- There is no row in position 0
更改程序池 管道模式 ---->经典 常见设置问题: 32位启用
- nginx+uwsgi01---flask部署
1.uwsgi.ini [uwsgi] # uwsgi 启动时所使用的地址与端口注意socket与http不同,http可以被外网访问0. socket = # 指向网站目录 chdir = /hom ...
- Jira的安装使用
1.什么是JIRA JIRA是目前比较流行的基于Java架构的管理系统,由于Atlassian公司对很多开源项目实行免费提供缺陷跟踪服务,因此在开源领域,其认知度比其他的产品要高得多,而且易用性也好一 ...
- LeeCode(No4 - Median of Two Sorted Arrays)
There are two sorted arrays nums1 and nums2 of size m and n respectively. Find the median of the two ...
- 转 PyCharm 进行调试 以及怎么熟悉一个已经成熟的项目的代码和断点 以及 jetBrains pycharm快捷键
https://blog.csdn.net/guider2334/rss/list Ctrl + Q 现实document视图,查看选择元素的详细信息 (重要) Ctrl + Alt + ...