jQuery_jquery を使用してパーソナライズされたフリップ効果ナビゲーション メニューを実装する方法

この記事の例では、jQuery がパーソナライズされたフリップ効果ナビゲーション メニューを実装する方法を説明します。皆さんの参考に共有してください。具体的な実装方法は以下の通りです。

コードをコピーします コードは次のとおりです:

<頭>




<スクリプト言語="javascript">
var nummove=0;
var numout=0;
$(関数(){
$("#btncell li").hover(
function(){
If(nummove==0)
{
nummove=1;
$("a",this).animate({ height: "0px",top: "25px"}, 80,function(){nummove=0;});
$("a",this).animate({ height: "28px",top: "10px"}, 80);
$("a",this).css("background"," yellow");
}
},
function(){
If(numout==0)
{
numout=1;
$("a",this).animate({ height: "0px",top: "25px"}, 80,function(){numout=0;});
$("a",this).animate({ height: "28px",top: "10px"}, 80);
$("a",this).css("background","#888");
numout=0;
}
}
)
$("#btncell li a").click(function(){
$(this).parents("li").css("z-index","2")
$(this).animate({ 高さ: "558px",上: "-255px",幅: "1000px",左: "-460px",不透明度: '切り替え',lineHeight: '558px',fontSize: '500px '}, 1000);
$(this).animate({ 高さ: "28px",上: "10px",幅: "50px",左: "25px",不透明度: 'toggle',lineHeight: '28px',fontSize: '12px'} 、400);
$(this).parents("li").css("z-index","1")
})
})



効果をプレビューすると、左下隅にエラーが表示され、更新後に効果を確認できません。

• 1


• 2


• 3


• 4


• 5


• 6

この記事が皆さんの jQuery プログラミングに役立つことを願っています。