ポカの続き-Objectタグ使用時のIEのリンクは親Window内で開かない:【無料素材倶楽部】WEBデザインブログ

無料素材倶楽部 > WEBデザインブログ> WEBデザイナー日記 > ポカの続き-Objectタグ使用時のIEのリンクは親Window内で開かない

ポカの続き-Objectタグ使用時のIEのリンクは親Window内で開かない

WEBデザイナー日記

ObjectタグでIEのリンクが親Window内で開かない

昨日の表示確認で大ポカしているワタシの続き。~~このサイトの右サイドバーにある、ランキングリンクで使用しているObjectタグの話。~~→現在はIframeに直しました。Object表示サンプルは以下

このOBJECTタグをFlashの埋め込みに利用している人も多いと思います。
OBJECTタグは、様々な形式のデータをページ内に埋め込むことができるタグで、imgタグ、iframeタグ、bgsoundタグ、embedタグ、appletタグの代わりとして汎用的使用ができる、優れもののタグ・・・・のはずなんですが・・・・

現状では、ブラウザの対応がイマイチで使えねータグと化しているわけです。特にIE。
IEでお越しでない方のためにこのサイトの該当部分をキャプチャ。

IEでの表示

Safariでの表示

Safariは、Konquererのレンダリングエンジン、KHTMLを元に開発されているので、未確認ですが、Konquererもご同様にスクロールバーがでるのではないかと。

Firefox2/3 Opera7UPでの表示

↑これが個人的にあらまほしき表示。Opera6ではスクロールバーはでませんが、フレーム枠がでます。

データの埋め込みは
<object data="データへのパス" type="ファイルタイプ" width="幅" height="高さ"></object>

こんな感じで使用するんですが、IEとSafariで、しょぼい感を増幅するスクロールバーがでてますでしょ。
最初ゲゲっと思ったんですが、でも、適度に目立つ気もする（注：参照）ので、そこは100歩譲ることに。
（注：悪目立ちするので、誰かクリックしてくれるかもしれないというさもしい思惑は見事にはずれてますので、真似しないように（笑)）

※Objectタグで外部ファイルを読み込んだ時に出るスクロールバーを消したい人はこちら

問題はここから。

IEの場合、このOBJECTタグ内で読み込んだデータ内にある普通にHTMLで書いたリンクをクリックしても、Parent（親であるこのページ）で開かず、子オブジェクト（子フレーム）内で開くのですよ。
子ページの　aタグのtarget属性に_top,_parent　どちらを書いてもだめ。javascript等で処理したくない場合、かろうじて、_blank　で新規窓立てるしかないんです。そういうわけで、このリンク群は、ターゲット属性が_top、_blank の２種あって、IEでお越しのみなさんがリンクをクリックすると、新規窓が開いたり、子オブジェクト内で開いたり、という情けないことになります。

何でほったらかしになっとったかといいますとね、ハイ！
「忘れてた」
んです。target属性を混在させてみて、「やっぱダメねえ」とか思ったとこで、多分、仕事で急な直しかなんか、入ったんですね。
ワタシは仕事以外でIEを使用しない人で、過去、年間傘を10本以上置き忘れしたことがある程度には忘れっぽいです。（だから、大事なことは目立つとこにメモ貼りします）
ついでに、別のことに集中してる時は、他のことに全然目がいかない、よく言えば一点集中型、普通に言えば、シングルタスクのぶきっちょです。
かくして、このサイドバーのリンク処理は、もずのハヤニエ状態になった、、と。単直に「アホ」ですな。

この件は、IEのバグという意見もありますが、IE5.5、IE6、IE7すべてそうなります。
メジャーVerUPを２回繰り返してもfixされないようなものは、バグというより、もはや仕様では？　と個人的には思います。
IE8ではどうなのよ、なんですが、β版のIE８、まだダウンロードしてません。8を早く試したい好奇心限りなくゼロでして。
正式リリースになってからでいいや状態。

このページのDoctypeは、XHTML 1.0 Transitional なので、フツーにiframeを使えるのに、そうしたくなかったのね。
(※XHTML 1.0 StrictやXHTML 1.1では、iframeは廃止)。

そういうわけで、gdgd云ってる間に、とっとと直せよ、おまえ、というのが正しい対処法なんですが、この際、このままにしようかと。
ここが直ったからといって特に影響もなし、ネットでは既出感たっぷりとはいえ、ブログでネタとして使えたことが何より収穫。
IEでObject使うとこーなるのよ、というサンプルとして、このまま置いておきます。
（仕事の関係者がこのサイトを見る確率は低い。ノープロブレムじゃ）

→追記：javascriptでのこの不具合解決法を記載するとともに、問題のサイドバーはiframe化しましたので、サンプルはこのページでご覧下さい。

他にも、実はモズのハヤニエ状態なことはあるんですが。

追記：
Objectタグ使用の際に出現するスクロールバーを消すには、読み込ませる外部ページがHTMLなら、その子ページのBODYに以下のスタイルを適用すると消えます。
body{
margin:0;
padding:0;
overflow:hidden;
border:none
}

« 表示確認で大ポカしているワタシ | WEBデザイナー日記 | WEB制作会社元社員が顧客データ１万人分消去 »