相关疑难解决方法(0)

我的网站上有一堆隐藏的图片.他们的容器DIV有style ="display:none".根据用户的操作,可以通过javascript显示一些图像.问题是打开页面时我的所有图像都被加载了.我想通过加载最终变得可见的图像来减轻服务器上的压力.我想知道是否有纯CSS方式来做到这一点.这是我目前正在做的两种hacky/complex方式.如您所见,它不是干净的代码.

<div id="hiddenDiv">
   <img src="spacer.gif" />
</div>

.reveal .img {
 background-image: url(flower.png);
}

$('hiddenDiv').addClassName('reveal');

这是方法2:

<img id="flower" fakeSrc="flower.png" />

function revealImage(id) {
 $('id').writeAttribute(
  'src',
  $('id').readAttribute('fakeSrc')
 );
}

revealImage('flower');