jQuery延迟直到加载背景图像，然后淡入？
我一直在做大量的研究，有大量的插件和教程，涵盖了大型背景图像的使用。 不幸的是，它们都有一个共同点 – 它们使用绝对定位的图像来表现为“假的”背景图像。
通常这对我来说很好，我之前已经做过，但是，这个项目有一个重复的背景图像，所以我必须使用普通的CSS规则来声明背景图像。
所有这一切，有没有办法检查图像是否加载，并告诉jQuery一旦加载后淡出这个背景图像？ 我正在寻找的主要方法是让jQueryvalidation图像是否实际加载。 如果没有，那么我想我需要解决一个简单的静态延迟（不幸的是，它会破坏连接速度慢的用户的效果）。
最后一件事 – 这可以通过CSS类切换/切换来完成，这样我可以在加载图像之前和之后更改body类吗？ 对于没有javascript的用户来说，这将是一个后备，并且会在背景图像加载时不必使用.hide()我的整个身体。
*编辑：这个线程似乎有类似的讨论，但我不认为这是完全相同的事情： 如何延迟html文本出现，直到加载背景图像精灵？ *
*编辑2 *
看起来上面的线程毕竟有效，除了我仍然缺少fadeIn效果。 我故意将fadeIn置于高位，并且由于某种原因它不是动画，任何想法为什么？
$(function() { // create a dummy image var img = new Image(); // give it a single load handler $(img).one('load',function() { $('html').css('background','url(/images/red_curtain.jpg) top center repeat-y').fadeIn(12000); // fade in the elements when the image loads }); // declare background image source img.src = "/images/red_curtain.jpg"; // make sure if fires in case it was cached if( img.complete ) $(img).load(); });
这似乎是一个老线程，但我找到了解决方案。 希望它可以帮助：
$(window).load(function(){ $('![]()
').attr('src', 'images/imgsrc.png').load(function() { $('#loading').fadeOut(500); $('#wrapper').fadeIn(200); }); });
使用$（document）.load（）来实现你想要的。
“我故意将fadeIn置于高位，并且由于某些原因它不是动画，任何想法为什么？”
就在页面加载之前
添加display: none; 到你的身体标签
然后用jQuery修改你的代码，看起来像这样：
$(img).load(function(){ $("body").show(); });
现在页面内容只会在img加载完成后显示。
要检查图像何时加载，请使用相同的src声明另一个“常规”图像（即
我可以提出的另一个技巧是回到“假”背景。 为了使它“平铺”，您可以创建一个iframe ，拉伸覆盖整个身体，并将该图像作为背景，然后根据您的喜好淡化iframe，同时页面的其余部分安全地保持在“主” “框架。