2016-07-24 223 views
-1

我有一個引導模式。該模式中有兩個引導選項卡。 「工作」按鈕是活動選項卡。 「租用」按鈕是另一個選項卡。此模態包裹着.COL-MD-8類這些樣式隱藏div點擊並顯示另一個div?

@media (min-width: 992px) { 
    .col-md-8 { 
     width: 87%; 
     margin-top: 37px; 
     margin-bottom: 31px; 
    } 
    } 

的問題是,在「服務」選項卡內容具有比「工作」的內容的更高寬度。所以它正在尋找他的方式。

enter image description here

我需要顯示「服務」選項卡上原有的寬度,當有人點擊「服務」選項卡。我知道這是因爲我用.col-md-8類包裝的。沒有任何選項可以在點擊時隱藏該主類並顯示「Hire」標籤的原始寬度?我正在使用流星並作出反應。

回答

0

您可以增加寬度模式對話框通過添加class.you可以添加類modal-lg。那麼您可以在點擊Hire選項卡時展開模式的寬度。

+0

我不需要增加它的父元素的寬度。 – MrWeb

1

如果你想實現這個最好的方法是使用jQuery。

你必須給工作id,僱用按鈕和工作內容以及聘用內容。

例如,

HTML:

<button id="work-btn">Work</button> <button id="hire-btn">Hire</button> 
<div id="work-content"> The content goes here </div> 
<div id="hire-content"> The content goes here </div> 

CSS:

.hire-content { 
display:none; 
} 

的Jquery:

$(document).ready(function(){ 
$("#hire-btn").click(function() { 
    $("#work-content").hide(); 
    $("#hire-content").show(); 
}); 
}); 

希望這有助於。如果您有任何疑問,請隨時提問。