2015年11月24日火曜日

[JS]タブ切り替えjqueryの中で、タブ切り替えっぽいやつを動かす

タブ切り替えjQueryを導入したコンテンツの中で、そのコンテンツの中でタブ切り替えっぽいやつを入れる事に。しかも、クリックしたらコンテンツが消えるのも実装することに。タブ切り替えスクリプトなら数あるが、jQueryプラグイン同士でコンフリクトを起こす事も多いので、JSで動くやつを見つけて感覚的改造を入れてみた。タブ切り替えはこちらのソースを、タブ内タブ切り替えっぽいのはこちらのソースを参考にしています。

●Javascript部分









●HTML








●メインのタブ切り替えAコンテンツ

タブ切り替えについては、参考サイトを参照。

●メインのタブ切り替えBコンテンツ

▼タブ内タブ切り替えぽいやつの動作

Cクリック(javascript)

Cのコンテンツが表示、Dは非表示。再クリックでCは非表示

Dクリック(javascript)

Dのコンテンツが表示、Cは非表示。再クリックでDは非表示

0 件のコメント:

コメントを投稿