首页 > 其他分享 >自适应代码

自适应代码

时间:2024-05-31 14:12:09浏览次数:19  
标签:body style widthRatio 代码 transform 适应 important document

adapterFunc(){
(function (win) {
document.body.style.zoom = 1;
// document.body.style = width:1920px!important; height:960px!important;overflow: hidden;
function refreshScale () {
let docWidth = document.documentElement.clientWidth;
let docHeight = document.documentElement.clientHeight;
var designWidth = 1920,
designHeight = 960,
widthRatio = docWidth / designWidth,
heightRatio = docHeight / designHeight;
document.body.style.zoom = widthRatio;
// document.body.style = "width:1920px!important; height:960px!important;transform:scale(" + widthRatio + "," + heightRatio + ");transform-origin:left top;";
// 应对浏览器全屏切换前后窗口因短暂滚动条问题出现未占满情况
setTimeout(function () {
var lateWidth = document.documentElement.clientWidth,
lateHeight = document.documentElement.clientHeight;
if (lateWidth === docWidth) return;
widthRatio = lateWidth / designWidth;
heightRatio = lateHeight / designHeight;
document.body.style.zoom = widthRatio;
// document.body.style = "width:1920px!important; height:960px!important;transform:scale(" + widthRatio + "," + heightRatio + ");transform-origin:left top;";
}, 0);
};
refreshScale();
win.addEventListener("pageshow", function (e) {
if (e.persisted) { // 浏览器后退的时候重新计算
refreshScale();
}
}, false);
win.addEventListener("resize", refreshScale, false);
})(window);
}

标签:body,style,widthRatio,代码,transform,适应,important,document
From: https://www.cnblogs.com/MrZhous/p/18224431

相关文章

  • java模仿微博代码_Java相对时间转换 工具代码
    privateStringdateToRelativeTime(Datedate){SimpleDateFormatdf=newSimpleDateFormat("yyyy-MM-ddHH:mm:ss");Datenow=newDate();longbetween=(now.getTime()-date.getTime())/1000;//除以1000是为了转换成秒......
  • idea将代码上传到gitee上
    先将代码上传到git本地仓库中操作流程:如图注意项目介绍不能为空,随便写写就行这样就上传到了本地仓库之后在上传到gitee远程仓库中    gitee官网地址:Gitee-基于Git的代码托管和研发协作平台面向企业提供一站式研发管理解决方案,包括代码管理、项目管理、文......
  • 用.NET代码生成JSON Schema 验证器
    问题对于验证复杂JSON数据是否合法的需求,通常的解决方式是标准JSONSchema,.Net下有对应的JSONSchema实现库。应用程序通常需要将标准JSONschema传入实现库,来做后续的数据验证。这里有一种情况,就是如果使用者不太了解标准JSONSchema格式,但又希望能在自己的service中使用其强大......
  • 618精选编程书单:提升你的代码力
    目录......
  • 学生HTML个人网页作业作品 使用HTML+CSS+JavaScript个人介绍博客网站 web前端课程设计
    ......
  • 低代码开发平台(Low-code Development Platform)的模块组成部分
    低代码开发平台(Low-codeDevelopmentPlatform)的模块组成部分主要包括以下几个方面:低代码开发平台的模块组成部分可以按照包含系统、模块、菜单组织操作行为等维度进行详细阐述。以下是从这些方面对平台模块组成部分的说明:包含系统低代码开发平台本身作为一个完整的系统,包含......
  • 设计模式:全网最全(23+10种)、最易懂(对比代码)、最简洁(三言两语)、最深度(带点评)的
    前言设计模式是软件开发中的重要工具,灵活掌握大量的设计模式,能够帮助我们编写更灵活、可维护和可扩展的代码。网上有许多关于设计模式的文章,往往把设计模式介绍得高深莫测,墨守成规。于是,不久前萌发了写一篇简单易懂的设计模式介绍的文章的想法。在开始之前,我想强调切勿滥......
  • QShop商城-添加新模块/页面(CodeSmith代码生成)
    QShop商城-添加新模块/页面(CodeSmith代码生成)工具准备CodeSmith当前使用的CodeSmith71,如找不到我已分享至:https://pan.baidu.com/s/1O2Tqg3gnbToAzjH0T5ETcg?pwd=2wcv下载后按照文档CodeSmith7激活教程.doc内容激活CodeSmith 代码生成下载激活后,双击TemplateEd......
  • 【高质量】2024数学建模国赛高质量模型代码(后续会更新)
    您的点赞收藏是我继续更新的最大动力!一定要点击如下的卡片,那是获取资料的入口!点击链接加入群聊【2024国赛资料合集】:http://qm.qq.com/cgi-bin/qm/qr?_wv=1027&k=p7NSXMsx84bWyAk6hpFRbl3kgrdQxMAw&authKey=m9IkEKrLi8iEwumJoLC9c5NkUODKjR3UL%2B3JDTZsdxQKXBI2WrDn9Tqfq9YqG......
  • 如何在代码中实现高效的数据存储和检索?
    要在代码中实现高效的数据存储和检索,可以采用以下几种方法:使用合适的数据结构:选择合适的数据结构对于数据存储和检索的效率至关重要。例如,使用哈希表可以实现O(1)时间复杂度的查找操作,而使用二叉搜索树可以实现O(logn)的时间复杂度。使用索引:对于大规模的数据集,使用索......