Question

如何使多个iframe可调整大小？我可以使用 jqueryUI库使一个iframe可调整大小。

我尝试如下：

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8" />
  <title>jQuery UI Resizable - Default functionality</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
  <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

  <style>

#iframe {
  width: 100%;
  height: 100%;
  border: none;    

  background: #eee ;

}

#resizable {
  width: 100px;
  height: 100%;
  background: #fff;
  border: 1px solid #ccc;


}

  </style>
  <script>
  $(function() {
    $('#resizable').resizable({
      start: function(event, ui) {
        $('iframe').css('pointer-events','none');
         },
    stop: function(event, ui) {
        $('iframe').css('pointer-events','auto');
      }
  });
  });
  </script>
</head>
<body>

<div id="resizable">
  <iframe src="test.html" id="iframe">
</div>

</body>
</html>

上面的代码对我来说很好。但是艾特知道我怎么能让多个iframe可以调整大小。我有两个iframe，如下图所示。我想让它们都可以调整大小。
的 JSFiddle

提前致谢。

enter image description here

在网页中调整多个iframe的大小

0 个答案: