TopJavaScript > Movable Type 4 の透過 PNG ロゴを IE6 以下のブラウザで透過する
2007年8月14日

Movable Type 4 の透過 PNG ロゴを IE6 以下のブラウザで透過する

Posted at August 14,2007 1:55 AM
Category:[JavaScript]
Tag:[, , ]

デフォルトテンプレートで新しく表示されている Movable Type 4 のロゴは透過PNGのため、IE6以下のブラウザでは透過されず、2色で表示されてしまいます(下)。

Movable Type 4 ロゴ

ここでは pngfix.js を利用して透過する方法を紹介します。

他にも透過PNGライブラリは色々出回ってます。

1.スクリプトのダウンロード・アップロード

PNG in Windows IE: How To Use の中間辺りにある pngfix.js のリンクをクリックして、pngfix.js をダウンロード。
ダウンロードした pngfix.js をサーバのブログ・ディレクトリ(index.html があるディレクトリ)にアップロード。

2.テンプレート修正

ブログ管理ページより「デザイン」→「テンプレートモジュール」→「ヘッダ」を選択し、head 終了タグの直前に下記を追加。
MT3以前のテンプレート構成を利用している場合(で新しいロゴを使っている場合)は、各テンプレートの head 終了タグの前に下記を追加。

<!--[if lt IE 7.]>
<script defer type="text/javascript" src="<$MTBlogURL$>pngfix.js"></script>
<![endif]-->

これで再構築をすれば下記のように透過されます。この設定は他の透過PNGにも有効です。

Movable Type 4 ロゴ(修正後)

Posted by yujiro
関連記事
人気エントリー
トラックバックURL


トラックバック

フクロウを飼い始めました/IEのmarginのバグと、サポートしてない透過pngに苦労した話。 from ただてとてとと歩きだす
フクロウを飼い始めた。といっても現実の世界で、ではなくBlogで。大宮ぺいとりおっつ日報さんのところで紹介されていたページで見つけたRSSアイコン(フクロ... [続きを読む]

Tracked on August 27, 2007 3:34 AM
コメント

このカスタマイズと
BlogPeople 等のリンクリストによる表示の遅延を解消する(その2:Ajax編)
を同時に行うと、PNG透過できないようなのですが、同時に使用することはできないのでしょうか?

もし、方法がありましたら教えていただきたいと思います。

[1] Posted by 虎! : September 4, 2007 10:26 PM

>虎!さん
こんばんは。
事後報告ですが、「prototype.js と pngfix.js の競合を解消する」に回答を記しました。

[2] Posted by yujiro : September 14, 2007 1:18 AM
コメントする

*必須



お知らせ:2008年5月現在、多忙のため、7月頃までコメントを速やかに回答できない状態が続きます。ご質問の内容によっては回答が7月以降になる可能性がありますので、予めご了承ください。

太字 イタリック アンダーライン ハイパーリンク 引用

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)

Now loading...
Entry Trackbacks
Entries of this Category
QRcode

現在停止中です
携帯電話からこのQRcodeを撮影することで携帯用URLを取得することができます

URI for cellular phones
ギターに入った猫
Styles
Font Size
Default
For defective color vision
Gray Scale
RGB Color
Search this site

このブログをメールで購読する by:FeedBurner

loading ...
BlogPeople
Now loading...
Syndicate this site
FeedBurner(RSS1.0/RSS2.0/Atom)
Counter
これまでのアクセス
クリエイティブ・コモンズ・ライセンス
Powered by
Movable Type 4.1
 
List Me!