0

我的网站上有一个推荐区域，该区域从一个推荐消失到另一个。我遇到了一个问题，即在下一个项目消失之前它会淡出太慢，导致两者都出现，使得一个大的 div 看起来很难看。

我希望它从一个推荐消失到另一个推荐，而不会同时跳跃和闪烁。

你可以在这里看到一个例子：http: //ledragonvert.com/index_test.php

这是我的 Javascript 代码：

function rotate_p() {
if (p_current == p_count) {
p_current = 1;
} else {
p_current++;
}
var $container = $('#container');
$container.find('p').fadeOut();
$container.find('p:nth-child(' + p_current + ')').fadeIn();
}

var p_count;
var p_current = 0;
var p_interval;
$(document).ready(function () {
rotate_p();
p_count = $('#container').find('p').length;
p_interval = setInterval(function () {rotate_p();}, 7000);
});

非常感谢您抽出时间来帮助我。

4

1 回答 1

1

该解决方案是基于 CSS 的。由于“p”元素的位置是静态的，并且您同时调用了fadeOut 和fadeIn，因此存在重叠，因为两个p 元素不可避免地会一起显示。要将它们放在另一个之上，您需要在 p 元素上使用绝对定位，如下所示：

 #container {
 position:relative;
  }
 #container>p {
    position:absolute;
   //use any values you wish, to set the testimonial relative to #container:
   top:10px; 
   left:50px; 
   }
于 2012-11-18T14:49:49.323 回答