可摺疊的IFrame長度規範

我試圖做一些事情，我有一個與IFrame內部的手風琴家，當他們點擊擴大。當他們點擊它擴展但只有一點點。我怎樣才能使它擴大更多。這裏是我的代碼：可摺疊的IFrame長度規範

<!DOCTYPE html> 
<html> 
<head> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script> 
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
    <style> 
#max200 { 
    height: 85%; 
    overflow-y: scroll; 
} 
    </style> 
</head> 
<body> 

<div class="container"> 
    <h2>Minilesson Directory</h2> 
    <div class="panel-group" id="accordion"> 
    <form id="max200"> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
     <h4 class="panel-title"> 
      <a data-toggle="collapse" data-parent="#accordion" href="#collapse1">Creating A Project - Minilesson #1</a> 
     </h4> 
     </div> 
     <div id="collapse1" class="panel-collapse collapse in"> 
     <div class="panel-body"> 
     <iframe src="https://docs.google.com/document/d/1K8YYw32TdEN9qd_tkypKQXDxwMh8uM3iAnUi5BcQ6jU/pub?embedded=true" height="85%" width="100%"></iframe></div> 
     </div> 
    </div> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
     <h4 class="panel-title"> 
      <a data-toggle="collapse" data-parent="#accordion" href="#collapse2">Collapsible Group 2</a> 
     </h4> 
     </div> 
     <div id="collapse2" class="panel-collapse collapse"> 
     <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
     quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> 
     </div> 
    </div> 
    <div class="panel panel-default"> 
     <div class="panel-heading"> 
     <h4 class="panel-title"> 
      <a data-toggle="collapse" data-parent="#accordion" href="#collapse3">Collapsible Group 3</a> 
     </h4> 
     </div> 
     <div id="collapse3" class="panel-collapse collapse"> 
     <div class="panel-body">Lorem ipsum dolor sit amet, consectetur adipisicing elit, 
     sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, 
     quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div> 
     </div> 
    </div> 
    </div> 
</div> 
    </form> 

</body> 
</html>

下面是結果： http://getthunkin.sanderjochems.nl/github/minilessons.php

謝謝！

來源

2017-04-24 Luca Galassi

使用引導程序手風琴，那麼你可以設置高度，如果IFRAME和它將會被自動更改

來源

2017-04-24 13:05:30

可摺疊的IFrame長度規範

回答

相關問題