jquery - jScroll 回调淡入新内容

Question

我正在尝试使用回调选项淡入 jScroll 加载的新内容。这是我到目前为止所尝试过的，但没有成功。

CSS

.jscroll-added {
    position: relative;
    float: left;
    width: 100%;
    opacity: 0;
}

JavaScript

 function neueFade() {
     jQuery('.jscroll-added').delay(1000).animate({
         opacity: 1
     }, 700);
 };

 jQuery(document).ready(function () {
     jQuery('.container').jscroll({
         debug: false,
         loadingHtml: '<img src="loading.gif" alt="Loading" />',
         padding: 0,
         nextSelector: '.prev-posts-link a',
         contentSelector: '.container',
         pagingSelector: '',
         callback: neueFade,
     });
 });

Answer 1

在调用动画之前，您必须先隐藏该元素。另外，如果您尝试通过选择 .jscroll-added 来制作动画，则您将为迄今为止交付的所有内容制作动画。为了做到正确，您必须仅定位刚刚添加的元素:

function neueFade() {
    $(this).hide().fadeIn(1000);
}