ホームページ > 記事 > ウェブフロントエンド > jquery_jquery に単純なタブプラグイン関数を実装するコード

jquery_jquery に単純なタブプラグイン関数を実装するコード

本題に戻りますが、全文はこちらです。

最初に 2 つの最も単純なレンダリングを添付します。

簡単な HTML コードを作成することから始めます。タブとして使用される UL タグとコンテンツを含む p タグ。

わかりやすくするために、３つだけ書きます。

今日は寒い夜に雪が舞うのを眺めました。冷めた心で遠くに漂っています...今も自由で自分の歌を永遠に歌い続け、何千マイルも旅しています。

家に帰る合図として鐘が鳴ったが、それは彼の人生に少しの悲しみをもたらしたようだった...自信は未来を変えることができる、誰がそれを変えることができるのかそれ？

変えられない試合、いつも背中に温もりを…言わせてください、本当に愛しています。

すべての外観に画像は必要ありません。シンプルにするだけなので、すべて CSS を使用します。ここでは、より重要なものを選択して書きます。

li{float:left;}

a{display:block;border:solid 1px #000;}

div{border:solid 1px #000;margin-top=-1px;}

.selected{border-bottom-color:#FFF; color:#F00;}//選択したタブの下部の境界線の色をコンテンツの背景と同じ色に設定します

ここでのハイライトは、単純な jquery を使用してタブ関数を実装する方法です。

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

jquery_jquery に単純なタブ プラグイン関数を実装するコード