Resolvido: onscroll add class jquery

ui.widget.ScrollTo

O principal problema com o uso do widget ScrollTo é que pode ser difícil controlar para onde o cursor do usuário se moverá quando ele clicar no widget. Isso pode dificultar a criação de uma interface de usuário fácil de usar.

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

    //>=, not <=
    if (scroll >= 100) {
        //clearHeader, not clearheader - caps H
        $("#header").addClass("scrolled");
    } else {
        $("#header").removeClass("scrolled");  
    }  }); //missing );

Este código é escrito em jQuery e é usado para alterar a classe CSS de um elemento quando o usuário rola a página.

A primeira linha cria uma função que será executada quando o usuário rolar a tela. A segunda linha armazena o valor de quão longe na página o usuário rolou em uma variável chamada 'scroll'. A terceira linha diz que se o valor de 'scroll' for maior ou igual a 100, então a classe CSS do elemento com um id de 'header' deve ser alterada para 'scrolled'. Caso contrário, ele deve ser alterado de volta para sua classe original.

importação

jQuery fornece uma maneira conveniente de importar outros arquivos JavaScript para o seu projeto. Para fazer isso, use a função jQuery import(). Por exemplo, para importar o arquivo myfile.js para o seu projeto, você usaria o seguinte código:

importar { meuArquivo } de './meuarquivo.js';

Isso incluirá automaticamente myfile.js em seu escopo de projeto atual e o tornará disponível para uso em seu código.

Ferramentas de desenvolvimento

Existem várias ferramentas de desenvolvedor disponíveis no jQuery. Essas ferramentas podem ser usadas para depurar código, inspecionar e modificar elementos DOM e muito mais.

Artigos relacionados:

Deixe um comentário