1. Método para remover barras de rolagem
Basta adicionar o atributo Overflow: oculto ao corpo. Não entrará em vigor sob o IE6 e 7. Você precisa adicionar o transbordamento: o atributo oculto ao html
No estilo, o IE6, 7 e outros navegadores precisam ser distinguidos por hack. Isso ocorre porque quando a página é puxada abaixo, se o HTML ou o corpo estiver transbordado: oculto, a página sob a camada de lâmpada transparente será parcialmente oculta normalmente. A escala de cinza visível através da visualização transparente, a cor específica está relacionada à cor de fundo definida pela plataforma e pelo usuário.
Depois de remover a barra de rolagem no corpo ou html, a página terá uma largura da barra de rolagem/2 salto! Esse salto é muito ruim para a experiência do usuário; portanto, adicione um preenchimento certo ao corpo, o tamanho é a largura da barra de rolagem. A largura da barra de rolagem sob a plataforma Windows é 17px. A largura das barras de rolagem de diferentes rollers na plataforma Linux é inconsistente. Você pode usar o código relevante para calcular a largura da barra de rolagem. A seguir, é apresentado um exemplo da plataforma Windows.
Código relacionado:
document.documentElement.style.csStext = 'Overflow: Nenhum;+Overflow: Hidden; _Overflow: Hidden;'; document.body.style.csStext = 'Overflow: Hidden;+Overflow: Nenhum; _Overflow: Nenhum; Padding: 0 17px 0 0;';
O código acima não considera se o HTML ou o corpo tem estilo embutido. Se o HTML ou o corpo tiver estilo embutido, ele precisará ser acumulado, caso contrário, o estilo original será limpo.
2. Outros métodos para remover os perigos ocultos role a página (evite a malha)
Depois de esconder a barra de rolagem, rolar a página com a roda do mouse não se moverá. Eu pensei que estava tudo bem, não ...
Os atalhos de teclado também podem operar algumas operações do navegador, relacionadas às páginas de rolagem, como: teclas para cima e para baixo, botões de giro de página, etc. Para atalhos de teclado, eles precisam ser cancelados.
3. Adicione estilo de camada pop-up
Adicione o estilo global ao corpo (compatível com o IE6)
Altura: 100%;
Adicione o estilo de rolagem à camada de bala
Overflow-y: automático; largura: 100%; altura: 100%; esquerda: 0; _padding: 0 17px 0 0; // bug ie6, o preenchimento do elemento pai ainda é válido depois que o elemento filho está absolutamente posicionado
O artigo acima sobre a máscara de camada pop-up do JS e a análise de detalhes da barra de rolagem de backlrol de fundo oculta é todo o conteúdo que compartilho com você. Espero que você possa lhe dar uma referência e espero que você possa apoiar mais o wulin.com.