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



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

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

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

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

関連記事

【FRPマスク制作】粘土型から石膏型を引きはがし、ワックスと洗濯のりを塗布します。

今回は石膏型の話からの続きになりますね。 事前に用意するもの 題名にも書いている通り、ワック

記事を読む»

マスク作ってみたじゃん1

では、今回から何度かに分けてマスク制作を追って行こうと思います。 こちらがそのリンクになり

記事を読む»

【FRPマスク制作】このあたりで、シリコンゴムとCアイを作ります。

FRPマスク自体の制作ではありませんが、重要なものです。Cアイを作っていきます。 半面を型取り

記事を読む»