Manipulando CSS com jQuery

O método utilizado para manipular CSS utilizando jQuery é o método ‘CSS()’. Podemos utilizar para aplicar e modificar propriedades CSS de um elemento HTML ou também para copiar o valor da propriedade desejada.

Exemplos:
Adotamos o seguinte HTML para estudo:

<body>
   <div>
      <h2>Manipulando CSS com Jquery</h2>
   </div>
   <input type="button" value="Click">
</body>

Aplicando propriedades CSS a um elemento HTML:
Quando houver um click no elemento <div> informamos as propriedades ‘color’ e ‘background-color’.

$('div').click( function(){
    $('div').css({color:"#FFF", backgroundColor: "#000" });
});

Obtendo valores da propriedade CSS desejada:
Quando houver um click no elemento <input> solicitamos o valor da propriedade ‘background-color’ do elemento <div>.

$('input').click( function(){
    var cor = $('div').css("background-color");
    alert(cor);
});

Lembrando que para utilizar o jQuery é necessário adicionar a biblioteca em seu código.

<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

Para interessados um exemplo completo pode ser acessado aqui.
Veja mais sobre o método ‘CSS()’ no site oficial: http://api.jquery.com/css/

Gostou? Compartilhe!

Compartilhe:

Postado por tpastorello

Leia Mais:

2 respostas para “Manipulando CSS com jQuery”

  1. […] This post was mentioned on Twitter by Blackjack, Tiago Pastorello. Tiago Pastorello said: RT @vinteum Blackjack » Manipulando CSS com jQuery http://retwt.me/1PIsT […]

  2. Gustavo disse:

    poxa! rsrsrs

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *