如何在一個頁面中顯示標題和描述jquery

嗨如何使用jquery在同一頁面中創建標題和描述。像這個http://www.st-andrews.ac.uk/its/projects/當點擊每個項目名稱時，描述將在下面打開，然後單擊另一個上一個打開的div將關閉。如何在一個頁面中顯示標題和描述jquery

來源

2012-10-13 Rafiur Rabby

谷歌* jquery手風琴* –

工作演示http://jsfiddle.net/tTD4D/

API使用：http://api.jquery.com/slideToggle/

還是喜歡佐爾坦提到：http://jqueryui.com/accordion/

這應該符合您的需要:)

代碼

$(".title").click(function() { 
    $this = $(this); 
    $content = $this.next(".content"); 
    if (!$content.is(":visible")) { 
     $(".content:visible").slideToggle(100); 
     $content.slideToggle(500); 
    } 
});

來源

2012-10-13 00:41:40

好的。它是div的一個例子。在單擊任何奇數的不行時，如何通過一個表格2行這樣的表格，下一個行甚至不會打開。 –

@RafiurRabby嗨，酷，是的，我們將解決它，輕彈你的代碼在小提琴我會看看男人'：）' –

這裏是基本

$('.title').on('click', function() { 
    if($(this).hasClass('open')) { 
     $(this).removeClass('open'); 
    } else { 
     $('.title').removeClass('open'); 
     $(this).addClass('open'); 
    } 
});

HTML代碼將是這樣的

<div class="title"> 
    title here to be clicked 
    <p class="desc">blah</p> 
</div>

的CSS也許是這樣的

.title p { 
    display: none 
} 

.title.open p { 
    display:block 
}

滑動效果或諸如此類的東西只是錦上添花蛋糕，你可以谷歌的東西

來源

2012-10-13 00:47:13 Huangism

如何在一個頁面中顯示標題和描述jquery

回答

相關問題