Условная проблема jQuery

#jquery #css #conditional #height

#jquery #css #условные операторы #высота

Вопрос:

Я пытаюсь создать условный оператор на страницах моего динамического продукта на моем веб-сайте, чтобы облегчить настройку высоты моих столбцов (как левого, так и правого) и центральной части ( #detail <div> ).

Теперь у меня есть этот фрагмент кода:

 $(window).load(function() {

  detailHeight = $('#detail').height();
  columnHeight = detailHeight   20;

  $('.columns').height(columnHeight);
  $('#detail').height(columnHeight);

});
  

Теперь я хочу убедиться, что высота columnHeight переменной равна не менее 550, так что высота столбцов и #detail <div> будет составлять не менее 550 пикселей в высоту.

Это связано с моей иллюстрацией Марио, в которой он помещает вызов в правый столбец. Это выглядит немного непрофессионально, если оно нависает над нижним колонтитулом.

Я пытаюсь добавить условный:

 if($(columnHeight) < 550) {
    columnHeight = 550;
}
  

К моему предыдущему коду, подобному этому:

 $(window).load(function() {

  detailHeight = $('#detail').height();
  columnHeight = detailHeight   20;

  if($(columnHeight) < 550) {
      columnHeight = 550;
  }

  $('.columns').height(columnHeight);
  $('#detail').height(columnHeight);

});
  

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

Вы можете просмотреть последствия проблемы здесь, на:

http://www.marioplanet.com/catalog.asp и переход к любому из продуктов,

или,

перейдя к http://www.marioplanet.com/product.asp ?IDnum=1 и путем изменения числа в IDnum=1 последней части URL-адреса на что-либо среднее между 1 и 45.

Любые предложения приветствуются!

Спасибо!!

Обновить:

Спасибо всем, кто опубликовал!

Вау, какая дурацкая ошибка!!

Ответ №1:

Вы имеете в виду включить $ перед columnHeight?

 if($(columnHeight) < 550) {
    columnHeight = 550;
}
  

должно быть:

 if(columnHeight < 550) {
    columnHeight = 550;
}
  

Вы заключаете число в объект jQuery. На самом деле я понятия не имею, чего от этого можно было бы ожидать!

Ответ №2:

Попробуйте:

если (высота столбца < 550) {
 Высота столбца = 550; 
}

Ответ №3:

Не уверен, почему вы используете jQuery columnHeight . Попробуйте это сделать:

 $(window).load(function() {

  detailHeight = $('#detail').height();
  columnHeight = detailHeight   20;

  if(columnHeight < 550) {
      columnHeight = 550;
  }

  $('.columns').height(columnHeight);
  $('#detail').height(columnHeight);

});
  

Ответ №4:

Разве вы не можете просто использовать свойство CSS min-height для .columns и #detail?

 .columns, #detail {
    min-height: 550px;
}
  

Комментарии:

1. Мне это очень нравится, спасибо! Я никогда не слышал об этом раньше, и здесь это весьма полезно. Я ищу код jQuery в этом экземпляре, хотя, так что да. Но я могу на самом деле реализовать это вместо этого.

2. @BOSS — на самом деле существуют 100% CSS-способы создания вашего макета столбцов; JavaScript не требуется. Пример.: matthewjamestaylor.com/blog /…

Ответ №5:

Разве этого не должно быть…

 if(columnHeight < 550) {
    columnHeight = 550;  
}
  

…в вашем примере вы пытаетесь создать объект jQuery из простой переменной?