Question

我有一个页面，在每个导航点上，网站中间的图像通过淡化来改变颜色。

我设法淡入：$（“＃active3”）。fadeIn（2000）; 但是我有一个问题再次消失。让我试着解释一下：我有5个导航点，有5个不同的图像。如果我（例如）从第一个导航点滚动到第三个导航点，因为在每个导航点上都会有3张图片相互叠加，一张图片就会淡入。

如果我再从第三个跳到第一个我必须以某种方式得到第一张照片（这对我来说不起作用，因为z-index不能褪色，或者？）或者我褪色2和3。

所以我试着淡出每个不在主动导航点上的图像。例如，当我在第二个导航点时，代码将是：

$("#active1").fadeOut(2000);
$("#active2").fadeIn(2000);
$("#active3").fadeOut(2000);
$("#active4").fadeOut(2000);
$("#active5").fadeOut(2000);

但似乎fadeOuts队列并不会同时发生。

这是我正在努力的网站：http://palmira-lopez.de

谢谢你的帮助！此外，作为一个sitenote，这不是一个商业项目，而是我的妈妈的网站：）

Answer 1

但似乎fadeOuts队列

您可以使用.finish()告诉jquery完成当前排队的任何内容。

$("#active1").finish().fadeOut(2000);
$("#active2").finish().fadeIn(2000);
$("#active3").finish().fadeOut(2000);
$("#active4").finish().fadeOut(2000);
$("#active5").finish().fadeOut(2000);

这可能不是你想要的，你可能想要.hide()那些不在这个过程中的人。

您可能最好添加一个类并使用css过渡。

滚动时有多个图像淡出

1 个答案: