ユーザが操作するフレーム - HTML/CSS/JS

Question

一度読み込んだフレームをドラッグ＆スケーリングできるようにするにはどうすればよいですか？これはHTML/CSS/JSで可能ですか？

<script> 
    var frame; 
    function addFrame() { 
     frame = document.createElement('iframe'); 
     frame.height = "200px"; 
     frame.width = "200px"; 
     frame.setAttribute('id', 'superFrame'); 
     document.body.appendChild(frame); 
    } 
    function loadGoogle() { 
     frame.setAttribute('src','http://www.google.com') 
    } 
</script> 

左は私が望むものですが、ユーザーがフレームをドラッグしてサイズを設定しています。

Image

Answer 1

SRC Responsive IFrames — The Right Way!

1. 削除の幅と高さは
含むdiv要素が応答作るのiframe

2. の親のdivを設定

3. 、および以下のサイズのiframeの属性/位置決めルール：

   iframe { ポジション：絶対; トップ：0; 左：0; 幅：100％; 高さ：100％;

   }