簡體   English   中英

使用自己的腳本更改iFrame大小

[英]Change iFrame size using its own script

我的問題很簡單,我的iframe帶有兩個按鈕和一些javascript代碼。 當我單擊這些按鈕時,我想使用其自己的腳本調整此iframe大小。 我找不到與此有關的任何教程。 但是我不為此使用jQuery。

我嘗試了幾種方法來使iframe對象無效。 有沒有可能做到這一點與跨瀏覽器兼容? 這是不好的做法嗎?

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

<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>

您不能只使用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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM