将背景图像淡入另一个背景图像

Question

抱歉，这似乎是 Stack 上类似问题的重复。
我发现了很多关于淡入淡出背景图像或用悬停改变它们的问题，但这并不完全适合我的需要。我只是想让它看起来像正在淡出的 loading.gif（设置为 background-image）。

我尝试使用此堆栈问题here 中的代码和建议。

我已经制作了一个 JSFiddle 来处理我的代码，但由于我不是专业开发人员，所以我的 jQuery 经验和知识充其量还可以，我无法让它工作。

对此的任何帮助将不胜感激。 JS 菲德：https://jsfiddle.net/tsruxyan/1/

Answer 1

我真的不明白你想要做什么以及如何改变背景或其他任何事情，你可以通过 jQuery $(elemnt).addClass 为你的元素添加一个类，然后在它的 css 代码中使用动画，最后删除回调函数中的类。

Answer 2

问题是您没有在 JsFiddle 中包含 jQuery 作为外部资源。这就是为什么你不能在其中调用 jQuery 函数的原因。

我不确定你想要实现什么，但如果你添加 jQuery，你可以简单地添加另一个（隐藏的）背景，使用 .fadeOut() 淡出第一个背景，然后使用 @ 显示第二个背景图像987654324@ 在第一个动画完成后立即显示另一个背景。

这可能是这样的：

$( "#clickme" ).click(function() {


  $( ".library-layout" ).fadeOut( "slow", function() {

    //Fade out ready, time to fade in the other image
    $( "#other-img" ).toggle( "slow", function() {
    // Animation complete.
        });
  });
});

概念证明是here。