見た目の上ではかぶっていませんが、それは星PNGの背景が透過されているからで要素同士はしっかりかぶっているため、背面のリンクボタンにマウスを置いてもカーソルの形は変わりませんし、クリックしても無反応です。(ギリギリかぶっていないリンクボタンの上端と右端は反応する)サンプル.01これをどうにか前面の星PNGに邪魔されずにリンクボタンをマウスに反応させるようにする、というのがこの記事の本題。}と書いてその名の通り前面になる要素をマウスに反応させなくする方法なんですが、ブラウザの対応状況から考えてとてもクライアントワークでは使えません。そもそもこのプロパティ自体、独自実装なのかな?で、どうしたもんかと悩んでいたところで、以下のような記事を見つけました。背面要素を取得する、という流れのようです。!という事で、早速泥くさい感じで試してみたのが以下のサンプル。サンプル.02とりあえず各主要ブラウザのほか、IE6やiPhoneでも動いているようです。実装によって挙動が異なるので、実際はもっとちゃんと書かないと破綻してしまう可能性大。iPhoneも拡大したりすると動かない。hatena記事タイトルが示す結果とは違うけど、とりあえず解決のメドがついたのでよしとしたいと思います。根本的な解決方法をご存知の方がいましたら教えて下さいませ。済むから簡単なんだけどなあ...。プラグインの不具合と記事の内容を少し修正しました。全部1ページに収めちゃう系のサイトでもしかしたら使えるかもしれないjQueryプラグインを作ってみました。似たようなのが既にどこかにあるのかも知れませんが、僕は知らないのでいいのです。CSS3でパノラマVR一時期によく見かけた気がするパノラマVRをiPhone/iPadに対応できるかみたいなことをふわっと質問され、「Three.jsさんならなんとかしてくれるんじゃないでしょうかー」とよく調べもせずに答えてしまいました。気になったので手持ちのiPhoneで実際に動かしてみたところ、ブラウザで開いた瞬間から明らかにダメそうな空気でしたのですぐにブラウザを閉じました。実行速度とかそもそもの問題でないかと思います(まあ、これもロクに調べてないんですが)。そのような訳で、以前にウワサでiPhoneではCSS3が安定してるみたいなことを聞いたような記憶があったりなかったりしたので、3D部分はCSS3にやってもらう体で試作してみました。Flickr修正すべき所はいろいろありますが、とりあえずそれっぽいものが出来ました。要素の3D化はCSS3で、マウスドラッグ(フリック)による視点の回転はJS(jQuery)でやってます。そもそもがThree.jsとかPapervision3Dといった3Dエンジンを利用するやり方とは大きく異なるので、仕様によっては実現がかなり難しくなりそう。上記のようにグルグル回すだけのものなら簡単だということは分かったので、今回はここまで。【Photoshop】ライアンのプロモーションビデオを作る。