javascript - jquery 使用滚动删除类类型

标签 javascript jquery html css scroll

我对 jQuery 有疑问。我希望当您在网站上滚动时标题会发生变化。但我的问题是我无法多次更改 header 。

我有一个开始,它有效。但现在我希望如果滚动小于 304 像素,那么不透明度就会消失。

这是我的代码

$(function() {
var header = $(".clearHeader");
$(window).scroll(function() {    
    var scroll = $(window).scrollTop();

    if (scroll >= 170 && scroll <= 305) {
        header.removeClass('clearHeader extraHeader').addClass('darkHeader');
    } 
    else if (scroll >= 305) {
        $('.aanvraag-button').css({"opacity":"1"});
    } 
    else {
        header.removeClass('darkHeader extraHeader').addClass('clearHeader');
    }
});
});

一切正常,但我希望如果您低于 304 像素,那么不透明就会消失。 我确实尝试了多种方法,例如删除类或在“”(空)或“0”上设置不透明度,但这没有用。

希望大家能帮帮我。

最佳答案

如果我没理解错的话,应该这样做:

var button = $('.aanvraag-button');
$(window).scroll(function() {    
    var scroll = $(window).scrollTop(),

    if (scroll >= 305) {
        button.css({opacity: 1});
    } 
    else if (scroll <= 304) {
        button.css({opacity: 0});
    }

});

如果您也希望 header 发生某些事情,只需将其放在 $(window).scroll() 中即可。

关于javascript - jquery 使用滚动删除类类型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26385357/

相关文章:

php - 我怎样才能使 DIV 使用 jquery 做到这一点?

javascript - 需要找到这个脚本

html - 如何在 Shiny 的仪表板中添加除元素名称之外的 Logo ?

javascript - 如何将日期字段存储为 Backbone.Model 中的 moment.js 对象?

javascript - 将动态值传递给插件函数 jquery

jquery - Rails 3/jquery - 使用 ajax 渲染部分选项卡

html - 将 app-root 中的 gif 中心与 Angular 中的中心对齐

javascript - Ember.js 中 `this` 的基本使用

javascript - Sublime Text 2 : replace text from JSON using regular expression

html - html 标题标签(<h1>、<h2>、<h3> 等)的默认字体大小(以像素为单位)是多少?