不能讓我的Javascript在本地計算機上正常運行？

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; dr如您所見，如果if語句不正確，則該函數中的else語句將刪除加載圖標。 因此，如果您希望它保留並只出現一次，那么您要做的就是刪除if語句中的else 。

那是你想知道的嗎？

//  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();
    }
}