Ir para conteúdo

POWERED BY:

Arquivado

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

Carlos Felipe Araujo

Imagem de fundo se ajustar junto com o conteúdo

Recommended Posts

Bom pessoal sou novo no fórum e gostaria de saber se alguém como fazer com que o fundo do site se ajuste ao conteúdo igual este site:

 

http://www.sabesp.com.br/Calandraweb/Calan...ub=T&Temp=0

 

O fundo de ajusta conforme a resolução do monitor, e não sei qual a tecnologia utilizada.

 

Por favor me ajudem!

Compartilhar este post


Link para o post
Compartilhar em outros sites

Isso é Javascript! Siga os Passos abaixo:

 

Crie uma imagem para cada largura de resolução, ou seja, 800, 1024, 1280 e 1600.

 

e use o script abaixo em seu index.html

 

<html>
<script type="text/javascript">
function getBG(x)
{
switch(x)
{
case 1600:
document.body.background = "1600.jpg"
break;

case 1280:
document.body.background = "1280.jpg"
break;

case 1024:
document.body.background = "1024.jpg"
break;

case 800:
document.body.background = "800.jpg"
break;

case 640:
document.body.background = "640.jpg"
break;

}
}
</script>
</head>
<body onLoad="getBG(screen.width)">
</body>
</html>

Abraço,

Roosevelt

Compartilhar este post


Link para o post
Compartilhar em outros sites

Movido de Dreamweaver Extensions http://forum.imasters.com.br/public/style_emoticons/default/seta.gif Dreamweaver

 

Bom, outra forma seria usando CSS, como no código abaixo:

 

Entre as tag's <head></head>

<style type="text/css">
body {	
	width: 100%;
	height: 100%;
	background-image: url(imagens/fundo.jpg);
}
</style>

Compartilhar este post


Link para o post
Compartilhar em outros sites

Carlos, caso você utilize a solução citada pelo Alebae, se sua imagem for maior que a resolução da tela do usuário o background vai sair cortado.

 

Exemplo se seu background-image tiver 1024X768 e o usuário estiver em 800X600 a imagem vai cortar.

 

Abraço,

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.