今日は左側のメニュー効果を作成しました。この効果は、バックグラウンドで作業するときに頻繁に使用する必要があります。コードも簡潔で明確なので、コピーして使用できます。効果の画像は次のとおりです。 コードは次のとおりです: (上下矢印のアイコンは上記の通り、アイコンは自分で変更できます) コードをコピー コードは次のとおりです: equiv="Content-Type" content="text/html; charset=gb2312" / > 背景の左側のメニューをクリックし、上下にスライドして jquery ; <br>$(function(){ <br>$(".box dt:first").addClass ("active"); <br>$(".box dd:not(:first)"). (); <br>$(".box dt").click(function(){ <br>$ (this).next("dd").slideToggle() <br>.siblings("dd"). slideUp(); <br>$(this).toggleClass('active') <br>.siblings(" dt").removeClass("active"); <br>}); > <br>* {padding:0; margin:0; } ; } <br>dl,dt,dd{list-style:none;} <br>.box { width :500px; border-bottom:1px; } <br>.box dt { height:30px; -高さ:30px; フォントサイズ:12px; ボーダー:1px; 背景:#eee url(img/bg.gif) 27px; } <br>.box dt.active { 背景位置:右 7px; } <br>.box dd { border-left:1px ソリッド #ccc; } <br>.box dd p{line-height:20px; } <br> a> 2 番目の項目 3 番目の項目 a href="#">最初のアイテム2番目のアイテム 3 番目の項目 タイトル 3 最初の項目 item タイトル 4 最初のアイテム2 番目のアイテム3 番目のアイテム
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
