Ir para conteúdo

POWERED BY:

Arquivado

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

marcosbin

[Resolvido] Javascript Para Ativar Overflow Se A Resolução Útil F

Recommended Posts

Olá amigos

 

Meu projeto é um site em Flash em que eu apliquei CSS + JS + AS para que o SWF sempre ocupe 100% da página, sem barras de rolagem. Quanto maior a resolução do usuário, mais ele verá a imagem de fundo (background feito no Flash).

 

Há uma área mínima, de 1002 x 588 px, em que, teoricamente, todos poderiam ver o site (usuários com resolução de 1024 x 768 ou superior). Mas tem um problema: quem usa aquelas firulas no navegador, como barra do Google, do AVG etc., acaba tendo uma altura útil menor e, com isso, o site pode aparecer cortado, sem mostrar o menu (que fica na parte de baixo).

 

Alguém conhece um script para detectar a resolução de tela útil do usuário? Gostaria ainda de determinar que se a altura fosse menor que o mínimo (588px), o JS liberasse o overflow vertical.

 

Um amigo me ensinou o código abaixo, porém não funcionou:

 

<script>
var w = window.innerWidth;
var h = window.innerHeight;
if(h < 588){
	document.getElementById('body').style.overflow="scroll";
}
</script>

Alguém pode me ajudar? Obrigado

Compartilhar este post


Link para o post
Compartilhar em outros sites

Tenho um código que funciona bem em todos os navegadores (testado no Opera, IE, Firefox, Safari e Chrome)

 

var pgHeight;
function dimPg() {
	if ( window.screen.availHeight ) {
					pgHeight = window.screen.availHeight;
				} else	if ( typeof(  window.outerHeight ) == 'number' ){
				pgHeight = window.outerHeight;
				}

				
	if ( 0 < pgHeight < 1200 ) {
		document.getElementById('body').style.overflow="scroll";
	}

}

Compartilhar este post


Link para o post
Compartilhar em outros sites

AndreRO,

 

mas aí ele vai pegar as barras a mais, que é justamente o que ele não quer...

 

Se não me engano, window.screen.availHeight é a resolução e window.outerHeight é o tamanho do janela do browser.

 

Acho que nesse caso, o melhor é document.body.offsetHeight, só não lembro se é crossbrowser.

 

http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif

Compartilhar este post


Link para o post
Compartilhar em outros sites

AndreRO,

 

mas aí ele vai pegar as barras a mais, que é justamente o que ele não quer...

 

 

 

Tem razão, desculpe... isso que dá não prestar atenção :P

 

 

Tenta com esse script aqui:

 

	var scnWid,scnHei;
	if (self.innerHeight) // all except Explorer
	{
		scnHei = self.innerHeight;
	}
	else if (document.documentElement && document.documentElement.clientHeight)
		// Explorer 6 Strict Mode
	{
		scnHei = document.documentElement.clientHeight;
	}
	else if (document.body) // other Explorers
	{
		scnHei = document.body.clientHeight;
	}

Fonte: http://www.webdeveloper.com/forum/showthread.php?t=161412

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oi Thiago e AndreRO

 

Eu acabei fazendo um outro código e funcionou. Usei jQuery e o script abaixo, vejam lá.

 

De qq forma, obrigado pelos scripts que postaram. Vou testá-los tb.

 

Abs

 

<script src="jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
	
	var h = $(window).height();
	
	if(h < 588){	
		$('.body').css('overflow-y', 'scroll');
		$('.body').css('overflow-x', 'hidden');
		$('.body').css('height', '588px');
	} else {
		$('.body').css('overflow', 'hidden');
		$('.body').css('height', '100%');
	}
});
<style type="text/css">
<!--
body{
	height:100%;
	overflow:auto;
}
-->
</style>

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.