Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

LucasVilela

[JQuery] Mudar fundo de div

Recommended Posts

Preciso mudar o fundo de todas as divs de um site. Queria saber como obter todas as divs em um vetor em jquery e depois mudar as configurações de background de cada vetor.

Tentei fazer olhando em algumas referencias e cheguei nisso:

<script>
 jQuery(document).ready(function(){
 clikCont=1;
 $(".altoContrase").click(function(){
            var obj = $( "div" );
            var arr = $.makeArray( obj );
            var fundo =[];


            if(clikCont ==1){
                    for(var i=0;i<arr.length; i=i+1){
                    fundo.push(jQuery(arr.get(i)).css("background"));
                    jQuery(arr.get(i)).css("background", "#000");
                    jQuery(arr.get(i)).css("color", "#FFF");
                    }
                    clikCont =  clikCont + 1;                
                }
           if(clikCont>1){
                for(var i=0;i<arr.length; i=i+1){
               jQuery(arr.get(i)).css("background", fundo.get(i));
                }
                clikCont = 1;
           }
        });

 })

</script>

Não sei o que está errado, e nem se posso fazer desse modo.

Quero algo semelhante com o código javascript abaixo, porém em jquery.

<script type="text/javascript">
function altoContraste() {
        var divs = document.getElementsByTagName("div");
        var links = geral.getElementsByTagName("a");
        
        
        for (var i = 0; i < divs.length; i++) {
             divs[i].style.background= '#000';
             divs[i].style.color= '#FFF';

        }
        for (var i = 0; i < links.length; i++) {
             links[i].style.color = '#FF0';
        }
        
        
    }
    </script>

 

Compartilhar este post


Link para o post
Compartilhar em outros sites

Controla no css cara.

 

No jQuery vc dá uma classe no body, e pelo css ao ter essa classe vc muda a cor.

Exemplo:

 

.black #header { color: #fff }
#header { color: #000 }
assim, para "voltar as antigas", é só remover a classe.

 

<body class="black">
Exemplo é o meu blog:

http://wbruno.com.br

 

Clique no botão "black theme" embaixo da minha foto.

Compartilhar este post


Link para o post
Compartilhar em outros sites

assim, para "voltar as antigas", é só remover a classe.

<script>
$(".altoContrase").click(function(){
    $("body").addClass('black');
});

// Para voltar ao modo normal
$("body").removeClass('black');
</script>

Pode fazer tudo em um único elemento, verificando se existe uma classe black no body, se existir remove, se não existir adiciona.

<script>
$(".altoContrase").click(function(){
    if ($("body")[0].className.indexOf('black') > -1) {
        $("body").removeClass('black');
    }
    else {
        $("body").addClass('black');
    };
});
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Isso ai @Diogo, segue o código "otimizado"

 

<script>
var $body = $('body');

$('.altoContrase').on('click', function() {
    if ($body.hasClass('black')) {
        $body.removeClass('black');
    } else {
        $body.addClass('black');
    };
});
</script>

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.