相关疑难解决方法(0)

我已经构建了一个图像滑块(基于极好的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来说明这是否是一个有效的数据URI.我基本上想要解析为空白/透明图像的最小数据URI,因此浏览器可以立即解析src并继续(没有错误或网络请求).也许src="data:image/gif;base64,"会更好？