調整，如果孩子的能見度變化（jQuery的）

我是很新的jQuery的容器，我解決不了這個問題：

我有2個InfoBoxes到內#content容器。當點擊infobtontons時，它們變得可見（通過切換jQuery函數）。

我的問題是，#content的大小沒有「調整大小」，我的意思是，它不會變大，所以信息框與下一個容器重疊。

我該如何預防？有沒有根據內容的可見性調整容器大小的功能？

編輯：

對不起，暫時不precice，這裏的代碼：

<div id="content"> 
. . . 

<script type="text/javascript"> 
$(function(){ 
    $('#info_icon').on('click mouseover',(function(){ 
    $('#info_text').toggle("slow"); 
    })); 
}); 
</script> 

<script type="text/javascript"> 
$(function(){ 
    $('#project_icon').on('click mouseover',(function(){ 
    $('#project_text').toggle("slow"); 
    })); 
}); 
</script> 

    <div id="info_text" style="display:none;"> 
... 
    </div> 


    <div id="project_text" style="display: none;"> 
... 
    </div> 
    </div>

#content { 
    background-color: #b12a28; 
    padding-left: 10%; 
    padding-top: 3%; 
    height: auto; 
} 


#info_text { 
    background-color: #FFF; 
    opacity: 0.8; 
    float: left; 
    height: 40%; 
    width: 25%; 
    padding: 10px; 
    margin-right: 3%; 
    margin-bottom: 10%; 
} 


#project_text { 
    background-color: #FFF; 
    opacity: 0.8; 
    float: left; 
    height: 40%; 
    width: 25%; 
    padding: 10px; 
    clear: none; 
}

來源

2012-11-23 Alice

你能發表一些代碼嗎？ –

也許你已經定義了最大高度或高度？看來它已經搞定了 – netadictos

通過加入來解決問題：overflow：hidden;在#content的css設置（這是因爲浮動元素...） – Alice

你給容器在CSS中的固定大小？

來源

2012-11-23 16:49:11 Taff

不，只需設置自動：/ – Alice

浮動元素導致該行爲...這可能有所幫助http://www.quirksmode.org/博客/檔案/ 2005/03/clearing_floats.html – Taff

oooh非常感謝你！問題解決溢出：隱藏 - 我永遠不會猜到，這是因爲浮動元素，謝謝！ – Alice

的第一個猜測是，有解決這個不是辦法jQuery/JavaScript但CSS，但你的用例的具體情況沒有說明，所以很難說。

至於用JavaScript這樣做，也許這元代碼將有助於

1) Detect KeyStroke event or #content on change 
2) Get the size of the various containers your are employing (e.g. $("#content").width(),height, etc) 
3) Resize the #content container such that it accommodates both boxes

祝你好運！

來源

2012-11-23 16:48:58

這聽起來像一個CSS問題，不需要JavaScript來解決。你能發佈一個鏈接，代碼或jsfiddle嗎？

來源

2012-11-23 17:14:44 Popnoodles

調整，如果孩子的能見度變化（jQuery的）

回答

相關問題