[英]Change iFrame size using its own script
My question is simple, I have iframe
with two buttons and some javascript code inside. 我的问题很简单,我的
iframe
带有两个按钮和一些javascript代码。 When i click these buttons, i want to resize this iframe
using its own script. 当我单击这些按钮时,我想使用其自己的脚本调整此
iframe
大小。 I couldn't find any tutorial for this. 我找不到与此有关的任何教程。 However i don't use jQuery for this.
但是我不为此使用jQuery。
I tried few methods to get iframe
object nothing works. 我尝试了几种方法来使
iframe
对象无效。 Is there possible way to do this compatible with cross browsers? 有没有可能做到这一点与跨浏览器兼容? and is this a bad practice?
这是不好的做法吗?
Main html page html主页
<html>
<head>
<title>Main Page</title>
<style>
iframe{
border: 1px solid black;
}
</style>
</head>
<body>
<iframe src="pages/widget.html" height="150" width="150" id="iframe1">
</body>
</html>
iFrame iFrame
<html>
<head>
<title>Main Page</title>
</head>
<body>
<button onclick="setSize1()">Maximize</button>
<button onclick="setSize2()">Minimize</button>
<script>
function setSize1(){
//get iframe object
iframe.style.height="300px";
}
function setSize2(){
//get iframe object
iframe.style.height="150px";
}
</script>
</body>
</html>
Can't u just use JavaScript: 您不能只使用JavaScript:
<script>const beer = {
name: 'Belgian Wit',
metric: 10,
keywords: ['pale', 'cloudy', 'spiced', 'crisp'] };
const markup = `<div class="beer"><h2>${beer.name}</h2><p class="brewery">${beer.metric +1}</p></div>`; document.body.innerHTML = markup;</script>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.