Как использовать переменную JQuery в CSS собственности

Question

I, имеющий следующую JQuery, который находит высоту отзывчивым изображения:

 $(document).ready(function() { //Fires when DOM is loaded 
      getImageSizes(); 
      $(window).resize(function() { //Fires when window is resized 
       getImageSizes(); 
      }); 
     }); 
     function getImageSizes() { 
      $("#slideshow img").each(function() { 
       var $height = $(this); 
       console.log($height.height()); 

      }); 

     } 

И моя цель заключается в использовании переменной $ высоты, чтобы определить высоту DIV с идентификатором слайд-шоу.

Я предполагаю, что я могу использовать это:

$('#slideshow').css({'height': $height + 'px;'}); 

Однако он не работает (не указана высота).

я включил эту строку следующим образом:

 $(document).ready(function() { //Fires when DOM is loaded 
      getImageSizes(); 
      $(window).resize(function() { //Fires when window is resized 
       getImageSizes(); 
      }); 
     }); 
     function getImageSizes() { 
      $("#slideshow img").each(function() { 
       var $height = $(this); 
       console.log($height.height()); 

       $('#slideshow').css({'height': $height + 'px;'}); 
      }); 

     } 

Есть ли что-то мне не хватает?

Answer 1

Вы регистрируете $height.height(), но только с использованием $height в CSS.

Если вы назвали переменные лучше, было бы проще: р

var $height = $(this).height(); 
$("#slideshow").css({"height":$height+"px"}); 

Или мои предпочтения:

document.getElementById('slideshow').style.height = this.height+"px"; 

Answer 2

$height - переменная jQuery. Вы должны получить его высоту, позвонив по номеру .height().

$('#slideshow').css({'height': $height.height() + 'px'}); 

Или вы можете вместо этого сохранить фактическую высоту как переменную.

var height = $(this).height(); 
$('#slideshow').css({'height': height + 'px'}); 

Answer 3

Вы сохраняете объект JQuery $(this) для переменной $height

Сделать это: var $height = $(this).height(); и вы будете все.

Answer 4

Проблема заключается в обработчике события:

 function() { 
      var $height = $(this); 
      console.log($height.height()); 

      $('#slideshow').css({'height': $height + 'px;'}); 
     } 

Вы пытаетесь сделать $height (который является объектом jQuery), объединенный с.(строка). Это заканчивается строкой '[object Object]px;', которая явно не то, что вы хотите. Вместо этого вам нужно использовать значение высоты. Это я думаю, что вы хотите:

 function() { 
      var height = $(this).height(); 
      console.log(height); 

      $('#slideshow').css({'height': height + 'px'}); 
     }