※ ChatGPTを利用し、要約された質問です(原文:iepngfix.jsでPNGを透過させたいがIE6/7で表示が不正)
iepngfix.jsでPNGを透過させたいがIE6/7で表示が不正
このQ&Aのポイント
サイト内に透過PNGを使用したいが、IE6/7で表示が不正
iepngfix.jsで透過PNGを背景に設定したdivボックスは正常に表示されるが、imgタグで配置したリンクボタンが一部不正
IE6/7では透過部分のグレー表示が無く、iepngfix.jsが原因かどうか不明。問題解決するためには、iepngfix.jsのバグか乗り換えが必要か検討中
iepngfix.jsでPNGを透過させたいがIE6/7で表示が不正
iepngfix.jsでPNGを透過させたいがIE6/7で表示が不正
サイト内に透過PNGを何点か使用したく、かつIE6に対応する必要があるため、上記「iepngfix.js」を導入しました。
divボックスの背景に敷いたPNG画像は無事に透過されましたが、そのボックスの中にimgタグで配置したリンクボタンの表示が一部不正です。
具体的には、IE6および7にて添付画像のような状態になります。8および他のブラウザは問題ないようです。
マークアップ設定としては、divのcontentsボックスに透過PNGの背景を指定、その中にリストボタンを並べるためのcontents_headlistボックスを配置、その中にaタグでリンクを設定した透過PNGボタンを配置しています。
関連部分のおおまかな設定は以下のとおりです。
body:全面にgif画像(透過なし)を敷き詰め
.contents:幅と高さを指定、透過pngをno-repeatで配置、「behavior: expression(IEPNGFIX.fix(this));」「overflow:hidden;」を付加
.contents_headlist:contentsボックス内に配置、幅と高さを指定、左にフロート、パディング指定、「behavior: expression(IEPNGFIX.fix(this));」付加
.contents_headlist内に設置したimg:幅と高さを指定、alt属性指定、リンク付加、「style="behavior: expression(IEPNGFIX.fix(this));」付加
IE6の表示でも、透過部分のグレー表示が見られないので透過自体はされていると思います。
できればiepngfix.jsを使用したままなんとかしたいのですが、iepngfix.js自体のバグか何かならば乗り換えもやむなしと考えています。
不明点等あれば追記しますので、よろしくお願いいたします。
お礼
ご連絡が遅くなりすみません。その節はありがとうございました。 そろそろIE6は考慮するブラウザから外したいですね・・・
補足
ありがとうございます! まさにこれじゃないかと思います。 配布元のサーバーのせいとは思いませんでした・・・ 今は素材が手元にないので、挙動は明日確認してみますが、ひとまずお礼を。ありがとうございました。