data-uriとしてエンコードされたブランク画像 [重複]。

質問

画像スライダーを作りました（ものすごい bxSlider をベースとした）イメージスライダーを作りました。それはすでにかなりうまく機能していますが、私の解決策が有効なHTMLであるとは思いません。

私のテクニックは次のとおりです。私は、最初のスライド画像が通常どおり挿入されたスライダー マークアップを生成します（( <img src="foo.jpg"> のようなデータ属性で参照されます。 <img data-orig="bar.jpg"> . そして、Javascriptは data-orig -> src を必要に応じて変更し、プリロードをトリガーします。

つまり、ある。

<div class="slider">
    <div><img src="time.jpg" /></div> 
    <div><img src="data:" data-orig="fastelavn.jpg" /></div> 
    <div><img src="data:" data-orig="pels_strik.jpg" /></div> 
    <div><img src="data:" data-orig="fashion.jpg" /></div> 
</div>

空白を避けるために src="" 属性（これは 性能に悪影響を与える で 一部のブラウザ を含む）、私は src="data:" を使用して、効果的にプレースホルダーとして空白の画像を挿入しています。

の中に何もないように見えるということです。 のドキュメントには、data-URI のドキュメントには、これが有効な data-URI かどうかを示すものが見つからないことです。私は基本的に、空白または透明な画像に解決する最小限のdata-URIが欲しいのですが、そうすればブラウザは直ちにsrcを解決して（エラーやネットワーク要求なしで）次に進むことができます。たぶん src="data:image/gif;base64," の方が良いのでしょうか？

どのように解決するのですか？

調べてみたところ 最小の透過GIF画像 という、data-uriとしてエンコードされたものが、これだった。

data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==

というのが、今使っているものです。