---- 淘宝优惠券 ----欢迎到论坛交流 ---域名问题某些图片和js资源无法访问,导致一些代码实例无法运行!(代码里gzui.net换成momen.vip即可)

scale自适应页面

前端开发 蚂蚁 357℃ 0评论
<div id="iframeBox">
	<div class="scale-box">
		<iframe allow-full-screen="true"></iframe>
		<img src="fullScreen.png">
	</div>
</div>
var ifr = document.querySelector("#iframeBox");
var box = ifr.querySelector('.scale-box');
var src = "/screen/?v=" + Math.random() + "#/home/" + (location.searchObj().id || "1") + "/1/";
document.querySelector("iframe").src = src;

function a() {
	var offsetWidth = ifr.offsetWidth,
		offsetHeight = ifr.offsetHeight;
	box.style.transform = `scaleX(${offsetWidth / 1920}) scaleY(${offsetHeight / 1080})`;
}
window.addEventListener('resize', a, false);
a();
document.querySelector("img").onclick = fullScreen;

转载请注明:有爱前端 » scale自适应页面

喜欢 (14)or分享 (0)
发表我的评论
取消评论

表情