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>
本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥15 关于#matlab#的问题:在模糊控制器中选出线路信息,在simulink中根据线路信息生成速度时间目标曲线(初速度为20m/s,15秒后减为0的速度时间图像)我想问线路信息是什么
- ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
- ¥16 mybatis的代理对象无法通过@Autowired装填
- ¥15 可见光定位matlab仿真
- ¥15 arduino 四自由度机械臂
- ¥15 wordpress 产品图片 GIF 没法显示
- ¥15 求三国群英传pl国战时间的修改方法
- ¥15 matlab代码代写,需写出详细代码,代价私
- ¥15 ROS系统搭建请教(跨境电商用途)
- ¥15 AIC3204的示例代码有吗,想用AIC3204测量血氧,找不到相关的代码。