Fórum WMO: Alterar Classe Css - Fórum WMO

Ir para

Página 1 de 1
  • Novo tópico
  • Responder
  • Ícone  Compartilhar

Alterar Classe Css Alterar atributo de uma classe do meu css

#1 Membro offline   marceloplis 

  • Novato no fórum
  • Ícone
  • Grupo: Usuários
  • Posts: 12
  • Cadastrado: 01/12/2005
  • Sexo:Não informado
Pontos: 0
Neutral

Postou 27/10/2006, 14:59

Pessoal, gostaria de saber se tem como fazer, por meio do Javascript, a alteração de atributos de uma classe do meu css, por exemplo:


   (CSS)
	.cor{
		  background :#FFFFFF;
		  color		   :#000000;
	}

   
   (Javascript)  ?????  Fazer algo assim:
   function muda(){
		 var classe = class.cor;
		 if( classe.background == #FFFFFF){
			  classe.backgraund = #000000;
			  classe.color		   = #FFFFFF;
		 }else{
			  classe.background = #FFFFFF;
			  classe.color		   = #000000;
		 }
  }

   (JSP)
   <input type="button" onclick="muda();">
   <div class="cor"></div>
   <div></div>
   <div class="cor"></div>
   <div></div>  
	


Gostaria de uma função que ao clicar no botão mudaria o valor dos atributos de uma classe CSS, assim todos meu elementos que estão usando esta classe sofreriam esta alteração.

Este post foi editado por marceloplis: 27/10/2006, 16:31

0

#2 Membro offline   bdoweb 

  • Super Veterano
  • Ícone
  • Grupo: Usuários
  • Posts: 1.641
  • Cadastrado: 31/07/2003
  • Sexo:Masculino
  • Localidade:São Paulo - SP
Pontos: 0
Neutral

Postou 27/10/2006, 16:23

pq naum muda a class de todo o elemento ....

document.getElementById("elemento").className = "novaClasseCSS";



[]'s
Quer ajuda seus amigo e ainda ganhar uma graninha?
Acesse agora mesmo http://yeapiz.com
0

#3 Membro offline   marceloplis 

  • Novato no fórum
  • Ícone
  • Grupo: Usuários
  • Posts: 12
  • Cadastrado: 01/12/2005
  • Sexo:Não informado
Pontos: 0
Neutral

Postou 27/10/2006, 16:42

Cara, funcionou, mas não exatamente do jeito que eu gostaria. Veja o código abaixo:

eu gostaria que funcionasse como se estivesse usando a propriedade "display: none|block", mas este qdo executado no Firefox ou Opera bagunça a tabela, no IE fica certinho, mas vendo as especificações da W3C a propriedade "display: none|block" não deve ser usado em colunas de tabela <td>.

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">

.oculto{
	visibility	: hidden;
}

.exibe{
	visibility	: inherit;
	background	: #C0C0C0;
	color		: #FFFFFF; 
}

</style>
<title>Table Collum</title>
</head>
<body>
	<script language="javascript">
		function showContent(){
			var par  = document.getElementById("mytable");
			var tds  = par.getElementsByTagName("td");
			for(x = 0; x < tds.length; x++){
				if(tds[x].id == "esc"){
					if(tds[x].className == "oculto"){
						tds[x].className = "exibe";
					}else{
						tds[x].className = "oculto";
					}
				}
			}
		}
	</script>
	
	<input type="button" value="Teste" onclick="showContent();">
	<table id="mytable">
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>
		<tr>
			<td>Coluna 1</td>
			<td>Coluna 2</td>
			<td id="esc" class="oculto">Coluna 3</td>
			<td id="esc" class="oculto">Coluna 4</td>
			<td>Coluna 5</td>
		</tr>		
	</table>
</body>
</html>

0

Página 1 de 1
  • Novo tópico
  • Responder

1 usuário(s) está(ão) lendo este tópico
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)