rem.js
2 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
var docEl = document.documentElement
var dpr = window.devicePixelRatio || 1
var clientHeight = 0
var appFontSize = 'normalsize'
// adjust body font size
function setBodyFontSize() {
if (document && document.body) {
document.body.style.fontSize = (12 * dpr) + 'px'
} else if (document) {
document.addEventListener('DOMContentLoaded', setBodyFontSize)
}
}
function changeRemValue(type) {
if (type === 'small') return 0.9
if (type === 'normalsize') return 1
if (type === 'large') return 1.1
if (type === 'Large') return 1.23
}
// set 1rem = viewWidth / 10
function setRemUnit(type = 'normalsize') {
if (type !== 'normalsize' || type !== 'small' || type !== 'large' || type !== 'Large') {
type = appFontSize || docEl.getAttribute('data-size') || 'normalsize'
}
// console.log(clientHeight)
// type = 'normalsize'
document.documentElement.setAttribute('data-size', type)
document.documentElement.style.setProperty('--appFontSize', changeRemValue(type))
setTimeout(() => {
try {
if (
document.querySelector('.skeleton-loading').classList.contains('active') &&
!document.querySelector('#app').classList.contains('fixed')
) {
changeContentHtmlHeight()
}
} catch (e) {
}
}, 200)
if (docEl) {
let rem = docEl.clientWidth / 10
if (rem > 37.5) rem = docEl.clientWidth / (10 + 1)
if (judgTerminal() === 1) {
const has = clientHeight ? (docEl.getBoundingClientRect().width / clientHeight) > (3 / 4) : false
// console.info('是否是折叠屏', docEl.getBoundingClientRect().width, clientHeight, has)
// console.info('fontSize', rem)
docEl.style.fontSize = (has ? rem / 2 : rem) + 'px'
} else {
rem = 37.5
docEl.style.fontSize = rem + 'px'
}
}
}
window.addEventListener('resize', () => {
if (window.config.VUE_BASE_NODE === 'dev') {
clientHeight = document.documentElement.getBoundingClientRect().height
}
setRemUnit()
})
if (judgTerminal() === 2) {
setRemUnit()
setBodyFontSize()
}