开发者

Possible/howto resize iframe on mouse focus?

I have two ifram开发者_如何学Pythones next to each other at 50% width and am wondering if it's possible to resize one iframe to 80% when that iframe is moused over. Is it possible? If so, can someone post a small how-to on getting this to work?


I tried this in 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>

EDIT: add code for IE

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜