Descobrir a area util do navegador

[Pita 53]

Olá pessoal, eu queria saber como faço para descobrir a area util do navegador(onde a pagina realmente aparece)

 

eu pesquisei e achei o seguinte código

document.body.offsetWidth; 
document.body.offsetHeight;

No Internet Explorer funciona perfeitamente e retorna o tamanho da area disponível, mas no Firefox ele retorna o quanto o body está utilizando, por exemplo, se o body tiver apenas 1 linha, ele nunca vai retornar a altura disponível e sim o quanto essa linha ocupa

 

Alguem sabe como fazer isso no Firefox??

[NeurotiC 0]

Não entendi muito bem a sua pergunda, porem a área útil que axo que você quis dizer é a area que aparece na janela do navegador para que não apareça barras de rolagens..

bem.. isso não é 100% em altura pois os navegadores tem barras diferentes...mais de largura sim..

Na resolução de 800 x 600 px a área é de 760 x 420 px

na resolução de 1024 x 768 px a área é de 955 x 600 px

 

Caso seu site não tenha largura flexivel, ou seja se ajuste a largura da janela aconselha-se usar a largura de resolução de 800 x 600 px pois muita gente ainda tem monitor de 14".

 

Espero que tenha ajudado..

[Pita 53]

Então NeurotiC

 

O problema é que esses tamanhos são teóricos, se o usuário instalar uma barra do google ou do yahoo essas alturas ficam menores, então não é confiável usar esses tamanhos como sendo padrao

 

eu tb não posso usar a idéia do 100% pq na verdade eu estou usando um objet para fazer drag drop, então queria saber para evitar do usuário arrastar o elemento para fora da janela

[klaygomes 0]

Tentai ai:

window.innerHeight

window.innerWidth

[Wilker Souza 0]

Engraçado que no IE aqui, so consegui ler o Width... o Height so dava 0 (zero).

Consegui resolver utilizando isso:

 

document.body.clientWidth

document.body.clientHeight

 

Isso no caso de IE... Com outros browser o innerwidth e height funciona beleza.

 

No caso, eu tb precisei fazer um evento de drag e drop mas sem deixar dar overflow.

o trecho citado acima ficou assim:

 

if (navigator.appName.indexOf("Microsoft")!=-1)

{

w = document.body.clientWidth;

h = document.body.clientHeight;

}

else

w = window.innerWidth;

h = window.innerHeight;

 

// objW e objH relacionados abaixo é o width e height do objeto que sofrera o drag e drop

// acrescentei + 10 pra não ficar colado nas bordas finais.

 

limitDragX = w - (objW + 10);

limitDragY = h - (objH + 10);

 

 

 

Abracos