javascript - 可能/如何在鼠标焦点上调整 iframe 大小?

标签 javascript iframe resize mouseover

我有两个相邻的 iframe,宽度为 50%,我想知道当鼠标悬停在该 iframe 上时是否可以将其中一个 iframe 的大小调整为 80%。是否可以?如果是这样,有人可以发布一个关于如何让它工作的小指南吗?

最佳答案

我在 Firefox 中尝试过:

<html lang="en">
    <head>
        <title>iframes</title>
    </head>
    <body>
      <div id="container">
        <iframe id="ifr1" style="width:45%;margin:0">a</iframe>
        <iframe id="ifr2" style="width:45%;margin:0">b</iframe>
      </div>
      <script>
        var dv = document.getElementById('container'),
            ifr1 = document.getElementById('ifr1'), 
            ifr2 = document.getElementById('ifr2');
            swapWidth = function(id){
                if(id === 'ifr1'){
                    ifr2.style.width = '15%';
                    ifr1.style.width = '75%';
                }else{
                    ifr1.style.width = '15%';
                    ifr2.style.width = '75%';
                }
            };
        dv.onmouseover = function(ev){
            ev = ev || window.event;
            var elm = ev.target || ev.srcElement;
            swapWidth(elm.id);
        };
      </script>
    </body>
</html>

编辑:添加 IE 代码

关于javascript - 可能/如何在鼠标焦点上调整 iframe 大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1795739/

相关文章:

javascript - Ember Controller 与 Ember ArrayController

ios - IOS 12.2 嵌入式 iframe 内按钮的问题

javascript - 在灯箱上查看 PDF

c# - 图像大小调整 - 有时质量很差?

javascript - 正则表达式替换为插入符号

javascript - 当用户断开连接时如何停止服务器上的计时器? (Node.js/socket.io)

javascript - postman setNextRequest 未执行

Javascript - 从数组中选择随机页面但绝不显示页面两次

javascript - 如何制作可调整大小的div,从侧面调整大小?

javascript - 为响应式网站正确调整全宽 <ul> 和 <li> 的窗口大小