Question

我正在使用一些Javascript，当你滚动到某个点时，它会出现一个特定的id，它会起作用并且会出现但是当你向后滚动它时它不会停留而是消失了。

以下是Jsfiddle的工作原理 - http://jsfiddle.net/rkerswell/jrpof73y/1/

它不在哪里？ - http://jsfiddle.net/rkerswell/t18m2tds/

在你提问之前，我已经复制了上面的工作代码，但这并不起作用。因此，如果有办法让它使用第二个Jsfiddle，那么它应该工作。有什么想法吗？

这也是我在JS文件中的Javascript。

$(function(){

    var startY = 300;

    $(window).scroll(function(){
        checkY();
    });

    function checkY(){
        if( $(window).scrollTop() > startY ){
            $('#sketch-progress, #photoshop-progress, #illustrator-progress, #indesign-progress, #css-progress, #html-progress, #mac-progress, #windows-progress').slideDown();
        }
        else{
            $('#sketch-progress, #photoshop-progress, #illustrator-progress, #indesign-progress, #css-progress, #html-progress, #mac-progress, #windows-progress').slideUp();
        }
    }

    checkY();

});

只是当它向后滚动时我才遇到问题。我遗失了什么？

Answer 1

我的假设是你希望动画在向上滚动后保留。为此，请查看您的代码。

$(function(){

//  Define the height the loading bar should appear at
var startY = 300;

//  Run this function whenever you scroll
$(window).scroll(function(){
    checkY();
});

//  The function ran when scrolling
function checkY(){
    //  If the window position is greater than the preset height
    if( $(window).scrollTop() > startY ){
        //  Make all of these ids slide down
        $('#sketch-progress, #photoshop-progress, #illustrator-progress, #indesign-progress, #css-progress, #html-progress, #mac-progress, #windows-progress').slideDown();
    //  If the window position isn't greater
    } else {
        //  Make all of these ids slide back up
        $('#sketch-progress, #photoshop-progress, #illustrator-progress, #indesign-progress, #css-progress, #html-progress, #mac-progress, #windows-progress').slideUp();
    }
}

//  Run this function again?
//  Not really needed with the scroll function
checkY();

});

TL;博士如您所见，如果您的if语句不正确，则该函数中的else语句将删除您的加载图标。因此，如果您希望它保留并且只显示一次，那么您只需删除else语句中的if。

那是你想知道的吗？

//  Try this in place of your original checkY function
function checkY(){
    if( $(window).scrollTop() > startY ){
        $('#sketch-progress, #photoshop-progress, #illustrator-progress, #indesign-progress, #css-progress, #html-progress, #mac-progress, #windows-progress').slideDown();
    }
}

不能让我的Javascript在本地机器上正常运行？

1 个答案: