I have two iframes 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?
+2
A:
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){
swapWidth(ev.target.id);
};
</script>
</body>
</html>
Mic
2009-11-25 10:02:27