大屏展现的核心:全屏固定展现;根据不同的屏幕分辨率缩放;数据定时自动更新。
1. 全屏固定展现
- html {height:90%;overflow-x:hidden; overflow-y:visible;}
- body {
- width: 2020px;
- height: 1080px;
- margin:0; padding:0;
- transform-origin: left top 0px;
- background-color: #0f2a42;
- background: url("bg.png") 0% 0% / 100%;
- position: relative;
- overflow: hidden;
- }
复制代码
2. 根据不同的屏幕分辨率缩放
- // 根据屏幕自动伸缩
- function scalebody() {
- var ratioX = jQuery(window).width() / jQuery('body').width();
- jQuery(document.body).css({
- transform: "scale(" + ratioX +")",
- backgroundSize: "100%"
- });
- }
复制代码
3. 数据定时自动更新
- /**
- * 每隔一段时间(毫秒)调用一次函数
- **/
- function croncall(func,ms)
- {
- func();
- var logstr = "("+date("Y-m-d H:i:s")+") croncall: "+func.name;
- log.info(logstr);
- setTimeout(function () {
- croncall(func,ms);
- }, ms);
- }
复制代码
|
|