2007年05月01日
このブログは都内近郊在住のとあるwebデザイナーが書いています。
webのこととかFlashのこととかASのこととかあとサーバーサイドのこととかをちょろっと。
他に趣味の写真とか仕事のこととかちょろちょろちょろっと書いたりしていきます。
モチベーションの続く限り続いていきます。
2007年05月08日
ごらんの通りこのブログ。
swfを背景に配置した一風変わったスタイルを採用しています。
Background-swf-contentsとでもいいますかw
swfを<div>内に配置しz-indexで重なり順を指定すればいいのですがなかなかどうして。
かなり苦労しました。
CSS、Flash、JSを駆使しブラウザの<object>周りの仕様の違いを解決し…。
クロスブラウザを実現するのに一番苦労しましたね。
なかなか楽しいコンテンツができたんじゃないかなと思います。
このBackground-swf-contents。
色々使い道ありそうだな~っと思っています。
Flash部分を作りこんでさらに魅力的なコンテンツができそうですね。
今はムービーを動かしていますがインタラクティブなコンテンツもいけるので色々いい夢が見れそうです。
ちなみにこのブログのirukakujiraという名前は。
イルカ似のクジラというのではなく。
G-SHOCKのイルカ・クジラモデルのことでもなく。
単なる思い付きなのです。
2007年05月22日
FireFoxでposition:fixedを使用して以下のような形で背景レイヤーを引いたりすると
<html> <head> <style type="text/css">#back {
width:100%;
height:100%;
position: fixed;
z-index:0;
top:0px;
left:0px;
background-color:#111;
}#front {
width:50%;
height:50%;
position: absolute;
z-index:10;
top:0px;
left:0px;
background-color:#999;
}</style>
</head>
<body>
<div id="back"></div>
<div id="front">
Front <input size="30">
</div>
</body>
</html>
なんとテキストフィールドにカーソルが表示されなくなってしまいます…。
カーソルが表示されなくなるだけで入力は可能です。
なんだか気持ち悪いですが…。バグでしょうか?
ちなみにNetScape7.1でも同現象を確認しました。
あとホイールスクロールが効かなくなるという現象も確認されました。
マウスポインタが#front上にあるとスクロールできますが、#back上にあるとスクロールが効かなくなります。
これも気持ち悪い現象ですね。
こちらのエントリーも関係あるかも知れません。
cloned.log Firefoxでz-indexを使うとフォームのカーソルが描画されなくなる問題
http://d.hatena.ne.jp/cloned/20061127
どうしてもFixedを使用する必要がある場合は一考の必要あり。