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



挙動の詳細が知りたい人は勝手にソースを除けばいいにゃ。
他のサイトみたいに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の方がより最適な処理を実現できるかもしれませんのでお試しください。

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

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

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

関連記事

さえにゃーの検索結果が5位になりました。ところがその頃サエダーは・・・

いやぁご主人。ボクもかなり人気者になってきたにゃ。SEOチェキで検索順位チェックをしてみたにゃ。そし

記事を読む»

年末は文章力をつけるよ!!!ファ??

えぇ、どうも、文章力を着けようと思っている、自称サエダーのヒーローです。いつも来ていただいて感謝して

記事を読む»

お!いいマスクだなぁ、、と思っていたら完全に騙された!(騙されたとは言っていない)

そのタイトルおかしくない??騙されたの?騙されてないの?? ・・・一言で言えば騙されてません。騙さ

記事を読む»