というわけで、これまで私のサイトのグローバルな美として活躍してくれたメニューをこのページに移動します。
いや~本当によく働いてくれました。
じゃぁ、移動しますね、えい。



挙動の詳細が知りたい人は勝手にソースを除けばいいにゃ。
他のサイトみたいにhighligher.jsとか使わないにゃよ。
そこまで、やさしくないにゃ!!

というより、動いてないソースだけべた張りしてるサイトとか気持ち悪いにゃ。
しかもどこかからのパクリを常に提供してるっていう

これこれ
まぁ、私は初心者にも中級車にも上級者にも優しくないですけどね。
とりあえず、jqueryは読み込んでおいてくださいね。

簡単にこちら解説しますね。まずはスタイル。

CSS

・Ulタグ内のリストをabsoluteで重ねます。
・Z-indexで重ね順を変更したりします。
・transform-originで回転基準点を決めます。※こちらのソースではJS部分に書かれていますが、スタイルでいいでしょう。

JavaScript

・リストの最大値と最大開閉角度を決めます。※私の場合は最大5リストで最大開閉角度は90°として設計しました。が開閉分は4つなので最大88°になっています。
・rotateに角度を割り振るfor文を与えます。
※for文内で条件分処理させるにはソースのように_iなどをfunction()内に設定します。
・マウスイベントなどを設定します。
※mousuout,overを使いましたが、onやmouseenter,leaveの方がより最適な処理を実現できるかもしれませんのでお試しください。

とまぁ、こんなもんですね。

随分簡単に解説するわね。
これじゃぁわからないんじゃないかしら?

分からなかったらツイッターででも聞いてください。
でも、プロでやってるのにこんなこともわからない人はいないでしょう。
大丈夫です。

関連記事

Re:イトーヨーカドーの魔法少女

さえにゃー見てください。 近所のイトーヨーカドーさんに行ってきたんですが、こんな写真を撮ってき

記事を読む»

私はローカルヒーローの批評が大好きなんです。ローカルヒーローが嫌いなわけじゃないですよ2

前回のサエダーズラボラトリーは↓ 一世を風靡咲いたフラッシュモブってあるじゃないですか??

記事を読む»

ツイッターで海老名市議が「同性愛は異常なのだ」とつぶやいたそうです

神奈川県海老名市の鶴指(つるさし)真澄市議(71)が29日、ツイッターに「同性愛は異常なのだ」などと

記事を読む»