Question

我正在使用一个脚本来改变div（类.hmcarousel）的背景图像和旋转木马通过5个图像 - 它似乎工作正常。但是我需要为每个转换添加一个动画淡入淡出效果（此刻即刻即刻更改） - 但不知道要添加动画脚本的函数的哪个部分。非常感谢帮忙。

jQuery(function ($) {
  var body = $('.hmcarousel');
  var backgrounds = new Array(
    "url(soml_slider_1.jpg)",
    "url(soml_slider_2.jpg)",
    "url(soml_slider_3.jpg)",
    "url(soml_slider_4.jpg)",
    "url(soml_slider_5.jpg)"
  );
  var current = 0;
  function nextBackground() {
    body.css(
      'background',
      backgrounds[current = ++current % backgrounds.length]
    );
    setTimeout(nextBackground, 5000);
  }
  setTimeout(nextBackground, 5000);
  body.css('background', backgrounds[0]);
});

Answer 1

您可以通过三个简单步骤完成效果。 1）淡出div 2）改变背景 3）淡化div

所以这看起来像淡化效果。所以，基本上你的功能看起来像：

    function nextBackground() {
body.fadeOut(1000);
body.css(
'background',
backgrounds[current = ++current % backgrounds.length]
);
body.fadeIn(1000);
setTimeout(nextBackground, 5000);
}

一切顺利！干杯！

jquery - 为背景图像更改添加动画

1 个答案: