この記事の例では、DIV レイヤーを縮小および拡張する jQuery メソッドについて説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。
<頭>
jQuery は DIV レイヤーの縮小および拡大効果を実現します
<スタイル>
/* 縮小および拡大効果 */
.text{line-height:22px;padding:0 6px;color:#666;}
.box h1{padding-left:10px;height:22px;line-height:22px;background:#f1f1f1;font-weight:bold;}
.box{位置:相対;ボーダー:1px ソリッド #e7e7e7;}
<スクリプトタイプ="text/javascript">
// 縮小および拡大効果
$(document).ready(function(){
$(".box h1").toggle(function(){
$(this).next(".text").animate({高さ: 'toggle', opacity: 'toggle'}, "slow");
},function(){
$(this).next(".text").animate({高さ: 'toggle', opacity: 'toggle'}, "slow");
});
});
初めてページを更新してください。
