0
我有三個標題充當按鈕。按鈕1，2和3.在頁面加載時，我想讓按鈕1部分顯示，但是如果有人點擊按鈕2或3以顯示上一個按鈕描述，並且新的按鈕顯示在其位置。讓show hide功能正常工作的問題
到目前爲止，我無法得到這個工作。我向普通課程添加了display: none;，但正如我所說的，我希望第一個顯示在頁面加載中。
我在做什麼錯？
$('#big-three-names').click(function() {
\t var thisDescription = $('.big-three-info', $(this));
\t $('.big-three-info').not(thisDescription).hide().parent().removeClass('closed');
\t thisDescription.slideToggle(500).parent().toggleClass('closed');
\t });.big-three {
\t margin: 75px 7.5% 25px 7.5%;
\t height: 900px;
\t border: 1px solid black;
}
#big-three-title {
\t text-align: center;
\t font-size: 1.6em;
\t padding: 50px 0 30px 0;
}
#big-three-description {
\t text-align: center;
\t font-size: 1.3em;
}
#big-three-names-out {
\t width: 100%;
\t height: 75px;
\t margin: 50px 0;
}
.big-three-names {
\t display: inline-block;
\t border: 2px solid #FFF;
\t width: 33.05%;
\t height: 100%;
\t text-align: center;
\t font-size: 1.5em;
\t font-weight: bold;
\t background-color: #000;
\t color: #FFF;
\t cursor: pointer;
}
.big-three-names:hover {
\t background-color: blue;
\t color: #FFF;
}
.big-three-info {
\t margin: 50px 20%;
\t border: 1px solid black;
\t height: 550px;
display: none;
}
#big-three-info-title {
\t width: 100%;
\t margin: 100px 0 25px 50px;
\t font-size: 1.2em;
}
#big-three-info-description {
\t width: 100%;
\t margin-left: 50px;
\t font-size: 1em;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
\t <div class="big-three-out">
\t \t <div class="big-three">
\t \t \t <div id="big-three-title">The "Big Three"</div>
\t \t \t <div id="big-three-description">fdmsnfdnofnkosjafnndsa.</div>
\t \t \t <div id="big-three-names-out">
\t \t \t \t <div class="big-three-names">1</div><div class="big-three-names">2</div><div class="big-three-names">3</div>
\t \t \t \t <div class="big-three-info">
\t \t \t \t \t <div id="big-three-info-title">
\t \t \t \t \t \t 1
\t \t \t \t \t </div>
\t \t \t \t \t <div id="big-three-info-description">
\t \t \t \t \t \t Description for 1.
\t \t \t \t \t </div>
\t \t \t \t </div>
<div class="big-three-info">
\t \t \t \t \t <div id="big-three-info-title">
\t \t \t \t \t \t 2
\t \t \t \t \t </div>
\t \t \t \t \t <div id="big-three-info-description">
\t \t \t \t \t \t Description for 2.
\t \t \t \t \t </div>
\t \t \t \t </div>
<div class="big-three-info">
\t \t \t \t \t <div id="big-three-info-title">
\t \t \t \t \t \t 3
\t \t \t \t \t </div>
\t \t \t \t \t <div id="big-three-info-description">
\t \t \t \t \t \t Description for 3.
\t \t \t \t \t </div>
\t \t \t \t </div>
\t \t \t </div>
\t \t </div>
\t </div>
有沒有辦法讓第一個出現在頁面加載，但？ – Paul
@保羅我編輯了我的答案。 – ketan
完美。謝謝！！ – Paul