Как получать высоту и ширину окна браузера автоматически с jQuery, когда он меняется?

Как я могу получать высоту и ширину автоматически? А именно, изменив ширину или высоту окна браузера, который автоматически меняет себе стоимость, или автоматически встретилась стоимость, изменив размер окна браузера.

Я хочу показать данные, автоматически не будучи должен реализовывать действие нажимания на кнопки, чтобы получать данные.

<!-- Función para obtener el Ancho(Width) --> 
function obtenerAncho( obj, ancho ) {
  $( "#anvent" ).text( "El ancho de la " + obj + " es " + ancho + "px. (Width)" );
}

<!-- Función para obtener el Alto(Height) --> 
function obtenerAlto( obj, alto ) {
  $( "#alvent" ).text( "El alto de la " + obj + " es " + alto + "px. (Height)" );
}
obtenerAlto( "ventana", $( window ).height() );
     obtenerAncho( "ventana", $( window ).width() );
$(window).resize(function(){


          obtenerAlto( "ventana", $( window ).height() );
     obtenerAncho( "ventana", $( window ).width() );
 

});
.btncls {
 padding: 10px;
 background-color:#000;
 color:#fff;
 border:none;
 cursor:pointer;
 margin:10px;
}
.txtcls{
 color:#44f;
 font-size:20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<button class="btncls" id="obtan">Obtener ancho</button>
<button class="btncls" id="obtal">Obtener alto</button>
<div class="txtcls" id="anvent">&nbsp;</div>
<div class="txtcls" id="alvent">&nbsp;</div>
6
задан 27.12.2016, 06:26
0 ответов

самое указанное состояло бы в том, чтобы использовать средний показатель - querys, https://developer.mozilla.org/es/docs/CSS/Media_queries

решая твою проблему я оставляю тебе функциональное изменение твоего кода

$(function () {
<!-- Función para obtener el Ancho(Width) --> 
function obtenerAncho( obj, ancho ) {
  $( "#anvent" ).text( "El ancho de la " + obj + " es " + ancho + "px. (Width)" );
}

<!-- Función para obtener el Alto(Height) --> 
function obtenerAlto( obj, alto ) {
  $( "#alvent" ).text( "El alto de la " + obj + " es " + alto + "px. (Height)" );
}
obtenerAlto( "ventana", $( window ).height() );
     obtenerAncho( "ventana", $( window ).width() );
$(window).resize(function(){


          obtenerAlto( "ventana", $( window ).height() );
     obtenerAncho( "ventana", $( window ).width() );
 

});
});
.btncls {
 padding: 10px;
 background-color:#000;
 color:#fff;
 border:none;
 cursor:pointer;
 margin:10px;
}
.txtcls{
 color:#44f;
 font-size:20px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="txtcls" id="anvent">&nbsp;</div>
<div class="txtcls" id="alvent">&nbsp;</div>

я оставляю тебе тот же пример в jsFiddle

https://jsfiddle.net / rn3w / 40gLkmfg /

Добавляя:

для различных устройств ты будешь должен делать эти консультации

$(window).resize(function(){

       if ($(window).width() <= 320) {  

              // es un movil

       }     

});
2
ответ дан 03.12.2019, 17:59
  • 1
    Пример функционирует хорошо, когда я меняю tamañ или окна браузера они являются данными automá ticamente. Но существует проблема aplicació n или có я говорю, что ты предложил меня только, начинаются данные, когда я меняю tamañ или окна браузера, но если я освежаю pá gina окно остается в мишени не показывает данных друг. –  27.12.2016, 04:38
  • 2
    @J.Doe издайте мой ответ проверь это porfavor –  27.12.2016, 04:42
  • 3
    Для этого он использует $ (document) .ready ()... кроме $ (window) .resize ()... что-либо подобное: $ (document) .ready (function () { $ (window) .trigger (' resize') }); –  27.12.2016, 06:56
  • 4
    Пожалуйста не удалять комментарий с зал чата из этой discusió n. Спасибо. –  27.12.2016, 07:34