jQueryでUI タブの内容を初期表示は非表示でクリックされたら表示するようにしたい
最初は項目のみ表示されるようにして、選択するとタブの内容が出るようにしたいです。
内容をdisplay: none;で消しておいて
$(function() {
$('.tab').click(function(){
$('.内容').show();
});
});
で表示するようにしてみましたが消えるだけで表示されませんでした。
jquery
1 $('#A').tabs({ 2 hide: { effect: 'fadeOut', duration: 200 }, 3 show: { effect: 'fadeIn', duration: 200 } 4 }); 5 6$(function() { 7 $('.B').click(function(){ 8 $('.naiyou').show(); 9 }); 10}); 11
html
1<div id="A"> 2 <ul class="B"> 3 <li><a href="#tabs-1">項目1</a></li> 4 <li><a href="#tabs-2">項目2<br class="ul--sp">/婚約指輪</a></li> 5 </ul> 6 <div class="naiyou" style="display: none;"> 7 <section id="tabs-1">項目1の内容</section> 8 <section id="tabs-2">項目2の内容</section> 9 </div> 10</div> 11 12
回答2件
あなたの回答
tips
プレビュー