模糊的JavaScript和CSS等部件滚动后无法正常工作(blurring other compo

我以前问StackOverflow上大约感谢平滑滚动后模糊一些组件到他们的JavaScript。我得到的回答，看到它是如何工作的jsfiddle和很满意，直到......我尝试了我自己。我不知道我做错了，但在我的例子，解决方案并不为大部分时间工作。我会说这是完全随机的，但事实是，当我点击菜单上的一些领域，去那里 - 它的工作原理，其他的一切都是模糊的。所以我滚动到顶部再次看到菜单，再次单击它，然后什么变得模糊。主要是它只是不工作。

目前，我观察到，它适用于从菜单中的第一个和最后的位置，而不是中间的。也许有些变量已经被清除？

var isBlurred = false;

$('#borders a').on('click', function(e) { 
    var el = $( e.target.getAttribute('href') );
    var elOffset = el.offset().top;
    var elHeight = el.height();
    var windowHeight = $(window).height();
    var offset;

    if (elHeight < windowHeight) {
        offset = elOffset - ((windowHeight / 2) - (elHeight / 2));
    }
    else {
        offset = elOffset;
    }

    $.smoothScroll({
        speed: 700,
        offset: offset,

        // 'blur' elements after scrolling
        afterScroll: function() {
            // blur elements
            $('.item').not(el).addClass('item--blurred');

            // remember that it's blurred
            isBlurred = true;
        }
    });

    return false;
});

$(window).on('scroll', function() {
    // don't do anything if we're not in a blurred state
    if(!isBlurred) return;

    // reset everything to a non-blurry state
    $('.item').removeClass('item--blurred');
    isBlurred = false;
});

可能有人帮助我，为什么在以前的情况下，从这里它的工作原理，并在我的情况（这里的jsfiddle ）不？