none
Salvar Largura x Altura janela Aspx RRS feed

  • Pergunta

  • Tenho um botão em uma página aspx e eu quero que quando ele for clicado, a largura, altura, posição da janela seja salva em variáveis, alguém tem alguma idéia? A janela que eu quero salvar essa informações abre como um pop-up
    segunda-feira, 20 de agosto de 2012 17:55

Respostas

  • Morrison, tudo bom?

    seguinte, vc pode pegar a altura e largura, jogar em campos hidden ou em variaveis e dps gravar via post ou mesmo ajax.
    O problema de vc fazer em javascript é que cada navegador pode apresentar uma propriedade diferente e isso atrapalha, aconselho vc a usar jquery para pegar as informações, ele já faz um cross-browser.

    O metodo para capturar largura e altura da janela em questão via jquery é:

     $(window).height()
     $(window).width() 

    Em javascript puro existem varias outras maneiras.

    var ie = /msie/i.test(navigator.userAgent);
    var ieBox = ie && (document.compatMode == null || document.compatMode == "BackCompat");
    
    var w, h; // Contem o width e o height da janela
    function getSize() {
     *var canvasEl = ieBox ? document.body : document.documentElement;
     *w = window.innerWidth || canvasEl.clientWidth;
     *h = window.innerHeight || canvasEl.clientHeight;
    }
    getSize();

    tambem dessa forma

    w = screen.availWidth;
    
    h = screen.availHeight;

    Eu faria usando jquery, mas ai vc quem decide!

    Abraços

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 12:17
  • Da sim


    JQuery

    $(window).unload( function () { alert("Adeus"); } );
    

    JS Normal

    window.onunload = function(){alert("Tchau tchau");}
    

    vc tb pode criar uma function, e no seu body vc coloca

    <body onUnLoad="alert('ok');">

    Isso que você quer?


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 17:23
  • <head>
    <script>
    function getParameters(){
    	w = screen.availWidth;
    
    	h = screen.availHeight;
    	x = window.screenX;
    	y = window.screenY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);
    }
    </script>
    </head>
    <body onUnLoad="getParameters();">
      <h1>Vai curintia!</h1>
    </body>

    Pega tamanho, largura, posição assim que fecha a janela abre o alerta.
    Veja se atende.


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 18:14
  • 	w = window.outerWidth;
    
    	h = window.outerHeight;
    	x = window.screenX;
    	y = window.screenY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);

    Ve assim se funciona!

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 19:00
  • Qual navegador e qual versão desse navegador vc esta usando?

    o codigo funciona, acho que falta ai ajustar para o navegador homologado, apesar que eu faria em jquery esse trabalho.
    lembrando que o codigo que estou colocando como exemplo não é jquery, é js puro!


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 19:40
  • function getParameters(event){
    	w = document.body.clientWidth;
    
    
    	h = document.body.clientHeight;
    	x = event.clientX;
    	y = event.clientY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);
    }

    <body onUnLoad="getParameters(event);">

    Agora vai, rodando em IE9!

    Rafael Boschini


    terça-feira, 21 de agosto de 2012 20:12
  • Isso!

    X é left e Y top!

    funcionou?

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 20:31

Todas as Respostas

  • Morrison, tudo bom?

    seguinte, vc pode pegar a altura e largura, jogar em campos hidden ou em variaveis e dps gravar via post ou mesmo ajax.
    O problema de vc fazer em javascript é que cada navegador pode apresentar uma propriedade diferente e isso atrapalha, aconselho vc a usar jquery para pegar as informações, ele já faz um cross-browser.

    O metodo para capturar largura e altura da janela em questão via jquery é:

     $(window).height()
     $(window).width() 

    Em javascript puro existem varias outras maneiras.

    var ie = /msie/i.test(navigator.userAgent);
    var ieBox = ie && (document.compatMode == null || document.compatMode == "BackCompat");
    
    var w, h; // Contem o width e o height da janela
    function getSize() {
     *var canvasEl = ieBox ? document.body : document.documentElement;
     *w = window.innerWidth || canvasEl.clientWidth;
     *h = window.innerHeight || canvasEl.clientHeight;
    }
    getSize();

    tambem dessa forma

    w = screen.availWidth;
    
    h = screen.availHeight;

    Eu faria usando jquery, mas ai vc quem decide!

    Abraços

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 12:17
  • Eu quero que ele faça isso quando a janela for fechada, sabes me dizer isso?
    terça-feira, 21 de agosto de 2012 13:52
  • Da sim


    JQuery

    $(window).unload( function () { alert("Adeus"); } );
    

    JS Normal

    window.onunload = function(){alert("Tchau tchau");}
    

    vc tb pode criar uma function, e no seu body vc coloca

    <body onUnLoad="alert('ok');">

    Isso que você quer?


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 17:23
  • ok, isso ja tinha feito, agora eu preciso ao fechar, pegar o tamanho da janela e posição, não estou conseguindo
    terça-feira, 21 de agosto de 2012 17:54
  • <head>
    <script>
    function getParameters(){
    	w = screen.availWidth;
    
    	h = screen.availHeight;
    	x = window.screenX;
    	y = window.screenY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);
    }
    </script>
    </head>
    <body onUnLoad="getParameters();">
      <h1>Vai curintia!</h1>
    </body>

    Pega tamanho, largura, posição assim que fecha a janela abre o alerta.
    Veja se atende.


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 18:14
  • Ele pega sempre o mesmo valor, mesmo que eu diminua ou aumente a janela. Tem que pegar o valor atual
    terça-feira, 21 de agosto de 2012 18:51
  • 	w = window.outerWidth;
    
    	h = window.outerHeight;
    	x = window.screenX;
    	y = window.screenY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);

    Ve assim se funciona!

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 19:00
  • Não deu também
    terça-feira, 21 de agosto de 2012 19:36
  • Qual navegador e qual versão desse navegador vc esta usando?

    o codigo funciona, acho que falta ai ajustar para o navegador homologado, apesar que eu faria em jquery esse trabalho.
    lembrando que o codigo que estou colocando como exemplo não é jquery, é js puro!


    Rafael Boschini

    terça-feira, 21 de agosto de 2012 19:40
  • É IE9, o valor recebe undefinied.

    Precisaria o tamanho atual da janela

    terça-feira, 21 de agosto de 2012 19:44
  • function getParameters(event){
    	w = document.body.clientWidth;
    
    
    	h = document.body.clientHeight;
    	x = event.clientX;
    	y = event.clientY;
    	alert('w:' + w + '\nh:' + h + '\nY:' + y + '\nx:' + x);
    }

    <body onUnLoad="getParameters(event);">

    Agora vai, rodando em IE9!

    Rafael Boschini


    terça-feira, 21 de agosto de 2012 20:12
  • w = document.body.clientWidth; // Largura

    h = document.body.clientHeight; // Altura

    x = event.clientX; // Left?

    y = event.clientY; // /topo?

    terça-feira, 21 de agosto de 2012 20:28
  • Isso!

    X é left e Y top!

    funcionou?

    Rafael Boschini

    terça-feira, 21 de agosto de 2012 20:31
  • Funcionou, valeu mesmo cara.

    terça-feira, 21 de agosto de 2012 20:33