土拨鼠1号 2021-04-06 09:54 采纳率: 60%
浏览 76
已采纳

Markdown 编辑器：全屏功能限制作用域

markdown编辑器的这个全屏功能，默认采取的高度与宽度为window的宽高，怎样去限定或者修改这个数值，将全屏功能限定在我指定的一个div内

  • 写回答

3条回答 默认 最新

  • 空城机 2021-04-06 13:49
    关注

    应该是类似这种吧 

    <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			#a {
				width: 300px;
				height: 200px;
				border: 1px solid yellow;
				position: relative;
			}
			#b {
				width: 200px;
				height: 100px;
				background-color: #0000FF;
				position: absolute;
				transform-origin:left top;
			}
			#c {
				width: 40px;
				height: 20px;
				border: 1px solid green;
				background-color: papayawhip;
			}
			#d {
				width: 800px;
				height: 600px;
				border: 1px solid red;
				position: absolute;
				left: 320px;
				top: 100px;
			}
		</style>
	</head>
	<body>
		<div id="a">
			<div id="b">
				<div id="c" onclick="fullScreen()">放大</div>
				1111111111
			</div>
		</div>
		
		<div id="d">
			<!-- 需要全屏放大的位置 -->
		</div>
		<script type="text/javascript">
			let isfull = false;
			function fullScreen() {
				let doc = document;
				if (!isfull) {
					let rateX = parseInt(doc.getElementById("d").clientWidth) / parseInt(doc.getElementById("b").clientWidth);
					let rateY = parseInt(doc.getElementById("d").clientHeight) / parseInt(doc.getElementById("b").clientHeight);
					doc.getElementById("b").style.transform = `scale(${rateX},${rateY})`
					doc.getElementById("d").appendChild(doc.getElementById("b"))
					isfull = !isfull
				} else {
					doc.getElementById("b").style.transform = `scale(1, 1)`
					doc.getElementById("a").appendChild(doc.getElementById("b"))
					isfull = !isfull
				}
			}
		</script>
	</body>
</html>

     

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(2条)

报告相同问题？

悬赏问题

  • ¥30 Matlab打开默认名称带有/的光谱数据
  • ¥50 easyExcel模板 动态单元格合并列
  • ¥15 res.rows如何取值使用
  • ¥15 在odoo17开发环境中，怎么实现库存管理系统，或独立模块设计与AGV小车对接？开发方面应如何设计和开发？请详细解释MES或WMS在与AGV小车对接时需完成的设计和开发
  • ¥15 CSP算法实现EEG特征提取，哪一步错了？
  • ¥15 游戏盾如何溯源服务器真实ip?需要30个字。后面的字是凑数的
  • ¥15 vue3前端取消收藏的不会引用collectId
  • ¥15 delphi7 HMAC_SHA256方式加密
  • ¥15 关于#qt#的问题：我想实现qcustomplot完成坐标轴
  • ¥15 下列c语言代码为何输出了多余的空格