Opacidade em Bootstrap v3.3.7

Q: Opacidade em Bootstrap v3.3.7

Resolvi assim: let rangeSuperior = document.getElementById('rangeSuperior') rangeSuperior.addEventListener('input', () => { let valor = rangeSuperior.value document.getElementById('header').style.opacity = valor configCardUp.style.opacity = valor //document.getElementById('segundaBarra').style.opacity = valor /*document.querySelectorAll('#navbararadmin a').forEach((valorCorrente, indice, vetor) => { valorCorrente.style.opacity = valor })*/ $('#navbaradmin a').each((chave, v) => { v.style.opacity = valor }) })

Agora
Testei com a última versão do Bootstrap e a versão 3.3.7 e esse problema não ocorre. Alguém faz ideia do que pode interferir neste funcionamento? Tinha um CSS a mais para os menus, mas nada referente à opacity.

Anteriormente
Pegamos um projeto há um tempo para fazer correções e melhorias e tem algo que não consigo ver erro da nossa parte, pelo motivo de não acontecer ao visualizar as páginas em celulares, apenas em PC, incluindo Notebook.
Se se um range de opacidade está em 100% que é o valor 1, o submenu de um dropdown não desaparece enquanto o mouse não sai dele, mas se está abaixo de 1, o submenu se comporta como se o mouse estivesse saindo dele rapidamente. Tentei fazer a mesma funcionalidade com JQuery e com Vanilla e o problema continua.
https://1drv.ms/v/s!Ap15WA7LCgcQ8n8JE5JYVQbxEAVX?e=YjY3Pb

// $('#rangeSuperior').on('input', () => {
    //     let valor = $('#rangeSuperior')[0].value
    //     $('#header')[0].style.opacity = valor
    //     configCardUp.style.opacity = valor
    //     $('#segundaBarra')[0].style.opacity = valor
    //     $('#nomeUsuario')[0].style.color = valor
    //     $('#navbaradmin a').each((chave, v) => { // Tinha usado o mesmo nome, "valor", para me referir ao mesmo elemento. Isso deu erro na pre visualização, onde alguns elementos a ficavam s/ mudança
    //         v.style.opacity = valor
    //         //console.log(v)
    //     })
    // })

    let rangeSuperior = document.getElementById('rangeSuperior')
    rangeSuperior.addEventListener('input', () => {
        let valor = rangeSuperior.value
        document.getElementById('header').style.opacity = valor
        configCardUp.style.opacity = valor
        document.getElementById('segundaBarra').style.opacity = valor
        document.querySelectorAll('li').forEach((valorCorrente, indice, vetor) => {
            valorCorrente.style.opacity = valor
        })
    })

1 Resposta

Solucao aceita

LeandroCGMS 23 de out. de 2019

Resolvi assim:

let rangeSuperior = document.getElementById('rangeSuperior')
    rangeSuperior.addEventListener('input', () => {
        let valor = rangeSuperior.value
        document.getElementById('header').style.opacity = valor
        configCardUp.style.opacity = valor
        //document.getElementById('segundaBarra').style.opacity = valor
        /*document.querySelectorAll('#navbararadmin a').forEach((valorCorrente, indice, vetor) => {
           valorCorrente.style.opacity = valor
        })*/
        $('#navbaradmin a').each((chave, v) => {
            v.style.opacity = valor
        })
    })

1 Resposta

Topicos relacionados