隐藏div点击并显示另一个div？

问题描述：

我有一个引导模式。该模式中有两个引导选项卡。 “工作”按钮是活动选项卡。 “租用”按钮是另一个选项卡。此模态包裹着.COL-MD-8类这些样式隐藏div点击并显示另一个div？

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

的问题是，在“服务”选项卡内容具有比“工作”的内容的更高宽度。所以它正在寻找他的方式。

我需要显示“服务”选项卡上原有的宽度，当有人点击“服务”选项卡。我知道这是因为我用.col-md-8类包装的。没有任何选项可以在点击时隐藏该主类并显示“Hire”标签的原始宽度？我正在使用流星并作出反应。

答

您可以增加宽度模式对话框通过添加class.you可以添加类modal-lg。那么您可以在点击Hire选项卡时展开模式的宽度。

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

答

如果你想实现这个最好的方法是使用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(); 
}); 
});

希望这有助于。如果您有任何疑问，请随时提问。

隐藏div点击并显示另一个div？

相关推荐