読者です 読者をやめる 読者になる 読者になる

purazumakoiの[はてなブログ]

技術メモから最近はライフログも増えてきてます。

faqとかのslideToggleを使ったアコーディオン

これだと文字が書いていない一行がリンクの範囲になる

<script type="text/javascript">
// <![CDATA[
$(function(){
	
	$('dl.faq > dd').hide();
	$('dl.faq > dt').css('cursor', 'pointer').click(function() {
		$(this).next().slideToggle('normal');
	});

});
// ]]>
</script>

これならspanをクリックしたら。としているので文字を押した場合に反応

<script type="text/javascript">
// <![CDATA[
$(function(){
	
	$('dl.faq > dd ').hide();
	$('dl.faq > dt strong').css('cursor', 'pointer').click(function() {
		$(this).parent().next().slideToggle('normal');
	});

});
// ]]>
</script>


via
Simple Toggle with CSS & jQuery by Soh Tanaka

$("h2.trigger").click(function(){
$(this).toggleClass("active").next().slideToggle("slow");
});