2011-01-25 5 views
5

base64文字列を使用して画像を表示する方法を試みました。しかし、誰も働いていません。私はIE6,7、Firefox 3でそれをテストしました。以下のコードで何が問題なのか教えてください。HTMLのBASE64が動作していません

<head> 

<STYLE type="text/css"> 
div.image { 
    width:100px; 
    height:100px; 
    background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA...); 
} 
</STYLE> 
</head> 
<body> 
<img src="data:image/jpg;base64,968" /> 
<img alt="Embedded Image" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIA..." /> 
<script type="text/javascript" src="data:text/javascript;base64,dmFyIHNjT2JqMSA9IG5ldyBzY3Jv..."></script> 
<div class="image"></div> 
</body> 
+0

私は[このページ](http://www.sweeting.org/mark/blog/2005/07/12/base64-encoded-images-embedded-in-html)が見つかったところです(7月、 2005)GIF画像のために行われました。この例(まだ)はFirefox 3.6で私のために働いています。 URLのサイズに制限があるかもしれないというコメントのちょうど興味深い言及。 – pascal

+0

この実装の理由は、アイコンへのアクセスによってサーバーがロードされたため、キャッシュ管理の進歩によって緩和されるはずですサーバー、ネットワーク、クライアント側)。 – pascal

答えて

4

私はそれだけでこれらのサポートデータのURIのどれもが(まあ、Firefox 3のは私だけではない、非常によく、考えていないん)ということが起こるIE6,7、Firefox 3の

上でそれをテストしました。あなたは何も間違っていません。

これらのブラウザで背景画像を表示する必要がある場合は、代わりに従来の画像ファイルとurl()を使用してください。

+0

+1、ここではブラウザがサポートしているかどうかを検出するJSの方法があります。 http://weston.ruter.net/2009/05/07/detecting-support-for-data-uris/ –

+0

私はfirfox 3.6を試しましたが、他の外部参照を与えずに画像を表示する方法はありますか? –

+0

@articlestack:Firefox 3.6はデータURIを正しくサポートする必要があります。しかし、正直言って、それは面倒の価値があるのですか?あなたのイメージはおそらく非常に大きくなることはないので、そのイメージのための1つの余分なHTTP要求が傷つくことはありません。 – BoltClock

関連する問題