Ir para conteúdo

POWERED BY:

Arquivado

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

tonglet

JavaScript para trocar class CSS

Por , em Javascript

Recommended Posts

tonglet    0

tonglet
Postado

Olá pessoal..

 

estou tentando fazer funcionar um esquema um pouco específico, que não consegui encontrar no Google ou algo assim.

Quero fazer com que, se a resolução de tela do cara for menor que um certo valor, uma class CSS seja substituída por outra. No caso, da div.geral para a div.geral2

 

Pelo que vi em alguns sites que ensinavam algo do gênero, cheguei no código que estou colando abaixo.. mas como não conheço quase nada de javascript, claro que não deu certo ^^'

 

Se alguém puder me ajudar, agradeço muito!

 

 

window.addEvent('domready',function(){

 

$$('div.geral').each(function(div){

div.addEvents({

if (screen.width <= "1220") { this.addClass('geral2'); },

});

});

 

});

Compartilhar este post

Link para o post
Compartilhar em outros sites

eibon    2

eibon
Postado

Posto na área certinha em...,já que java e javascript são a mesma coisa né? -.-'

Tópico movido

 

Origem: Programação » Plataforma Java » Java web

Destino: Desenvolvimento » Javascript / DHTML

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buongiorno    0

Buongiorno
Postado

Olá Tonglet, beleza?

 

Aí está um exemplo, adapte-o ao que você precisa. Veja a observação que coloquei no script.

 

<html><title>:: Resolução ::</title>
<head>
<style>
.um {
	background:#2a7df9;
	position: absolute;
	width: 100px;
	height: 100px;
	left: 50px;
	top: 50px;
	padding-top: 40px;
	padding-left: 15px;
}
.dois {
	background:#EC6E08;
	position: absolute;
	width: 100px;
	height: 100px;
	left: 50px;
	top: 50px;
	padding-top: 40px;
	padding-left: 20px;
}
</style>
</head><body>

<div id="resolucao" class="um"></div>

<script>
if(screen.width < 1024 || screen.height < 768)
{
document.getElementById('resolucao').className = 'dois';
}

document.getElementById('resolucao').innerHTML = screen.width +' x '+screen.height;

/*
Obs.:
Neste exemplo, como o script que muda a classe do elemento é executado automaticamente ou seja não
está atrelado a nenhum evento e apenas segue a "ordem de interpretação da página" de cima para baixo,
é fundamental para seu bom funcionamento que ele esteja aqui em baixo na página, após o elemento alvo
da mudança.
*/
</script>
</body>
</html>

 

Até mais.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buongiorno    0

Buongiorno
Postado

Posto na área certinha em...,já que java e javascript são a mesma coisa né? -.-'

Tópico movido

 

Origem: Programação » Plataforma Java » Java web

Destino: Desenvolvimento » Javascript / DHTML

 

 

 

Vale lembrar que as linguagens Java e Javascript não são a mesma coisa!

Provavelmente amigo deve ter esquecido de digitar o "não", ou então está sendo irônico.

 

Até mais.

Compartilhar este post

Link para o post
Compartilhar em outros sites

tonglet    0

tonglet
Postado

Yey! Obrigado, funcionou direitinho. Eu só não usei a altura como parâmetro, e tirei o último comando.. ficou assim:

 

<script>

if(screen.width < 1200)

{

document.getElementById('tudo').className = "geral2";

}

 

 

</script>

 

muito obrigado Buongiorno ^^

 

e ah sim, desculpem pelo lugar do tópico... não vi o Javascript na principal do fórum.. acabei entrando na programação Java mesmo e quando vi a parte de web, pensei ser este o lugar ^^''' apesar de eu não conhecer muito, sei pelo menos que Java e JavaScript são coisas diferentes =]

 

sorry e obrigado de novo!

Compartilhar este post

Link para o post
Compartilhar em outros sites

tonglet    0

tonglet
Postado

Yey! Obrigado, funcionou direitinho. Eu só não usei a altura como parâmetro, e tirei o último comando.. ficou assim:

 

<script>

if(screen.width < 1200)

{

document.getElementById('tudo').className = "geral2";

}

 

 

</script>

 

muito obrigado Buongiorno ^^

 

e ah sim, desculpem pelo lugar do tópico... não vi o Javascript na principal do fórum.. acabei entrando na programação Java mesmo e quando vi a parte de web, pensei ser este o lugar ^^''' apesar de eu não conhecer muito, sei pelo menos que Java e JavaScript são coisas diferentes =]

 

sorry e obrigado de novo!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Buongiorno    0

Buongiorno
Postado

Eu só não usei a altura como parâmetro

 

Realmente se você estiver usando como padrão a largura de 1024 pixels é desnecessário usar altura, já que essa

largura corresponde a uma única largura que é 768 pixels. Mas se o padrão escolhido for 1280 pixels de largura você

precisará usar a altura também pois, nesse caso há duas opções de altura.

 

Veja:

 

800 x 600

1024 x 768

1280 x 768

1280 x 1024

1600 x 1200

1920 x 1440

 

Obs.: Essas são as opções disponíveis no meu Windows XP, não sei dizer quanto a outros sistemas.

 

 

Até mais

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Javascript
×

Informação importante

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

  Aceito