橫屏代碼
let width = document.documentElement.clientWidth
let height = document.documentElement.clientHeight
let ele = document.getElementById('horizontal-content')
let style = ''
if (width >= height) { // 橫屏
style += 'width:' + width + 'px;'
style += 'height:' + height + 'px;'
style += '-webkit-transform: rotate(0); transform: rotate(0);'
style += '-webkit-transform-origin: 0 0;'
style += 'transform-origin: 0 0;'
} else { // 豎屏
style += 'width:' + height + 'px;'
style += 'height:' + width + 'px;'
style += '-webkit-transform: rotate(90deg); transform: rotate(90deg);'
style += '-webkit-transform-origin: ' + width / 2 + 'px ' + width / 2 + 'px;'
style += 'transform-origin: ' + width / 2 + 'px ' + width / 2 + 'px;'
}
ele.style.cssText = style
uj5u.com熱心網友回復:
overflow-y: auto; 豎屏overflow-x: auto; 橫屏
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/233320.html
標籤:JavaScript
