使用 JQuery 预加载即时添加的图像

发布于 2024-10-19 16:11:00 字数 521 浏览 1 评论 0原文

我在 Page_Load() 事件中将一些图像从数据库添加到 div 中。当您将鼠标悬停在其中一张黑白图像上时，您会看到彩色图像。我想预加载彩色图像，但在执行此操作时遇到问题。我当前的代码循环遍历所有图像，并将以下内容添加

<script type="text/javascript">
<!-- 
$(document).ready(function() { 
    $("<img />").attr("src", "%s").load(function(){ 
        $("body").append($(this)); 
    }); 
});
--></script>

到 RegisterClientScriptBock 中，其中 %s 是图像的路径。我尝试过将其附加到身体上或不将其附加到身体上，但似乎都不起作用。据我所知，这似乎是预加载图像的方式，但我愿意接受其他建议。我是否因为即时执行此操作而遇到问题？

谢谢。

原文

I am adding some images to a div from a database in the Page_Load() event. When you hover over one of these black and white images, you see the colour image. I would like to pre-load the colour images but am having issues doing it. My current code loops through all the images, and adds the following:

<script type="text/javascript">
<!-- 
$(document).ready(function() { 
    $("<img />").attr("src", "%s").load(function(){ 
        $("body").append($(this)); 
    }); 
});
--></script>

to a RegisterClientScriptBock where %s is the path to the image. I have tried with and without appending it to the body but neither seem to work. From what I can see, this seems to be the way to pre-load images but I am open to other suggestions. Am I having issues because I am doing it on the fly?

Thanks.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

剑心龙吟 2024-10-26 16:11:00

您是否考虑过创建一个绝对位于左侧和顶部 -10000px、高度/宽度 1px 的 div，然后将所有图像与 html 一起放入其中？我不知道为什么你需要使用 js 来实现这一点。

回复收藏 0 原文

雨落星ぅ辰 2024-10-26 16:11:00

也许这会有帮助？

http://www.yourhtmlsource.com/images/preloading.html

<script type="text/javascript">
<!-- hide from non JavaScript Browsers

Image1= new Image(150,20)
Image1.src = "pic1.gif"

Image2 = new Image(10,30)
Image2.src = "pic2.gif"

Image3 = new Image(72,125)
Image3.src = "pic3.gif"

// End Hiding -->
</script>

Image1=新图像第一步是为图像设置新的脚本效果
（150,20），分别是该图像的宽度和高度
Image1.src = "pic1.gif" 给出图像的来源。

Maybe this will help?

http://www.yourhtmlsource.com/images/preloading.html

<script type="text/javascript">
<!-- hide from non JavaScript Browsers

Image1= new Image(150,20)
Image1.src = "pic1.gif"

Image2 = new Image(10,30)
Image2.src = "pic2.gif"

Image3 = new Image(72,125)
Image3.src = "pic3.gif"

// End Hiding -->
</script>

Image1= new Image is the first step of setting up a new script effect for an image
(150,20) are the width and height, respectively, of this image
Image1.src = "pic1.gif" gives the source of the image.

回复收藏 0 原文

~没有更多了~