Javascript优化

Question

我似乎无法弄清楚如何让JS工作。 scrollfunction的作品，但不是隐藏。无论如何，使用较少的代码行来做到这一点？我想要.down-arrow到fade out之后50px并隐藏在50px之后它不能被点击。它正在我的网站和codepen上工作，但随后它随机停止工作。该代码显然是错误的，但不知何故，它正在...

JS：

$(window).scroll(function() { 
    $(".down-arrow").css("opacity", 1 - 
    $(window).scrollTop()/50); 
}); 

$(window).scroll(function() { 
    $(".down-arrow").hide(fast); 
    $(window).scrollTop() > 50); 
}); 

[编辑]

这是新的JS我上有明显语法错误和建议，意见写道：将其放置在同一个身体，我希望也是闲着：

$(window).scroll(function() { 
    $(".down-arrow").hide("fast"); 
    $(".down-arrow").css("opacity", 1 - 
     $(window).scrollTop()/50); 
}); 

但现在我想的箭头，当使用可以追溯到到顶部的50像素关口上方显示。

Answer 1

首先的首先，有没有需要注册一个funcition两次

var element = $(".down-arrow"); 
$(window).scroll(function() { 
    if($(window).scrollTop() > 50){ 
    element.css("opacity","0"); 
    if(!element.hasClass("hidden")){ 
    element.addClass("hidden"); 
    } 
    }else{ 
    $('.down-arrow').removeClass("hidden") // if there is nothing, nothing to remove 
    $(".down-arrow").css("opacity", 1 -$(window).scrollTop()/50); 
    } 
}); 

一些CSS改变：

.down-arrow.hidden{ 
    display:none; 
} 
.down-arrow:hover { 
    //you have to overwrite inline opacity , which js makes.. 
    opacity: 1 !important; 
} 

现在，应该按预期工作，试试:)