请教JS高手：网页中如何以隐含方式加载图片?

来源：百度知道 编辑：UC知道 时间：2024/09/22 03:56:40
网页中有一个我写的用JS来变换菜单图片背景的程序,当网页打开时可以显示默认图片背景,但当鼠标移到那个地方的时候，需要显示变换的图片背景，图片却还没有下载下来，是空白的．我希望它早下载了，当鼠标移到上面的时候图片显示出来．
函数如下：
<script language=javascript>
<!--
function bgimg(str) //当鼠标移上去的时候加载这个函数
{ //v3.0
document.getElementById("bgimages"+str+"").style.backgroundImage = "url(images/"+str+".gif)";
}
function oubgimg(atr)//移开时
{
document.getElementById("bgimages"+atr+"").style.backgroundImage ="";
}
-->
</script>

<table id=bgimages1 onClick="document.getElementById('mq').src='1.asp?s=random'" onMouseDown="document.getElementById('cxcx').innerHTML ='<B>文章录入</B>）';" onMouseOut=oubgimg(1) onMouseOver=bgimg(1) width="173" height="32" border="0" cellpadding="0" cellspacing="0" background="images/gl_r6_c1.gif">

CSS：隐式载入图片

#preloadedImages {
width: 0px;
height: 0px;
display: inline;
background-image: url(path/to/image1.png);
background-image: url(path/to/image2.png);
background-image: url(path/to/image3.png);
background-image: url(path/to/image4.png);
background-image: url();
}

调用：

<div id="preloadedImages"> </div>

刚才给你写的，也不知道你要的是不是这个结果

利用2个不同背景图片的CSS 样式相互切换样式

以下代码全部复制过去就可以用，你要做的就是分别把CSS样式中bg和bg1中的2张图片换成你自己的就OK 了 长度和宽度 你可以根据自己的需要调整

下面是代码

<style type="text/css">
<!--
.bg {
background-image: url(bg0.jpg);
background-repeat: no-repeat;
height: 25px;
width: 149px;
}
.bg1 {
background-image: url(bg.jpg);
background-repeat: no-repeat;
height: 25px;
width: 149px;
}
-->
</style>