当前位置: 首页 > news >正文

JavaScript元素根据父级元素宽高缩放

/*** 等比缩放* @param wrap 外部容器* @param container 待缩放的容器* @returns {{width: number, height: number}}* 返回值:width:宽度, height:高度*/aspectRatio(wrap: any, container: any) {// w = h / ratio, h = w * ratioconst wrapW = wrap.width;const wrapH = wrap.height;let cW = container.width;let cH = container.height;const rc = cW / cH;if (rc > 1) {// const w = wrapH * ratio;if (cW <= wrapW) {cW = wrapW;cH = wrapW / rc;}} else if (rc < 1) { // w:h = w1:h1 =>if (cH <= wrapH) {cH = wrapH;cW = rc * cH;}} else if (rc === 1) {const v = wrapW > wrapH ? wrapH : wrapW;cH = v;cW = v;}return {width: cW,height: cH,};}

原文链接

JavaScript元素根据父级元素宽高缩放

在这里插入图片描述

http://www.lryc.cn/news/270440.html

相关文章:

  • 易趋产品升级(EasyTrack 11_V1.3) | 集成飞书、WPS、个性化设置,增强团队协作和用户体验
  • 帆软FineBi V6版本经验总结
  • 03.MySQL的体系架构
  • 随笔笔记-2023
  • 2023.12.31 Python 词频统计
  • day12--java高级编程:网络通讯
  • MongoDB聚合:$out
  • 一次奇葩的spin_lock_irq / spin_unlock_irq使用不当导致的系统卡死分析
  • 公司创建百度百科需要哪些内容?
  • qt中信号槽第五个参数
  • 模式识别与机器学习-SVM(线性支持向量机)
  • 【并行计算】GPU,CUDA
  • 计算机网络教案——计算机网络设备章节
  • 什么是SLAM中的回环检测,如果没有回环检测会怎样
  • ubuntu 通过文件设置静态IP、DNS、网关
  • mapboxgl 中热力图的实现以及给热力图点增加鼠标移上 popup 效果
  • golang并发安全-sync.map
  • 开发第一个SpringBoot程序
  • 2023年度总结—你是你的年度MVP吗?
  • Linux基础知识学习3
  • Leetcode5-在长度2N的数组中找出重复N次的元素(961)
  • openssl的 openssl.cnf配置文件详解
  • SpringBoot集成支付宝,看这一篇就够了。
  • 数据结构程序设计——哈希表的应用(2)->哈希表解决冲突的方法
  • 微信小程序开发系列-07组件
  • JavaScript 中 Set 和 Map 的区别
  • web前端之JavaScript
  • C# 图标标注小工具-查看重复文件
  • 浅谈冯诺依曼体系和操作系统
  • Good Bye 2023