Javascript-форум - Добавить css класс родительскому элемнту

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Добавить css класс родительскому элемнту (https://javascript.ru/forum/dom-window/67917-dobavit-css-klass-roditelskomu-ehlemntu.html)

Добавить css класс родительскому элемнту

Здравствуйте!
У меня есть div внутри которого может быть картинка, а может и не быть... Проблема в том, что средствами css у меня не получается автоматически регулировать высоту этого блока - блок не растягивается по высоте (сам не понимаю почему, вероятно потому что он прижат к экрану свойством position: absolute), т.е. если я задаю #u25210-bw высоту жестко {height: 300px} - то работает, если нет - то картинку не видно

<div class="browser_width colelem" id="u25210-bw">
 <div>
   <!-- biggest banner -->
  <a href="/" target="_blank">
    <div id="banner-biggest" alt="на главной" style="background-image: url('/58c0847705f64.jpg');min-height: 367px;background-color: rgb(0, 0, 0);background-position: center bottom;background-repeat: no-repeat;background-size: cover;">
    </div>
  </a>
 </div>
</div>

Можно ли тогда средствами js добавлять новый CSS класс блоку #u25210-bw, только при условии что внутри него есть img ?

Цитата:

Сообщение от Igorsrt

Можно ли тогда средствами js добавлять новый CSS класс блоку #u25210-bw, только при условии что внутри него есть img ?

Можно. :yes:
Только в твоем примере нет картинки внутри элемента с ИД равным u25210-bw... :no:

Цитата:

Сообщение от Igorsrt (Сообщение 447422)

<div class="browser_width colelem" id="u25210-bw">
 <div>
   <!-- biggest banner -->
  <a href="/" target="_blank">
    <div id="banner-biggest" alt="на главной" style="background-image: url('/58c0847705f64.jpg');min-height: 367px;background-color: rgb(0, 0, 0);background-position: center bottom;background-repeat: no-repeat;background-size: cover;">
    </div>
  </a>
 </div>
</div>

Можно ли тогда средствами js добавлять новый CSS класс блоку #u25210-bw, только при условии что внутри него есть img ?

#u25210-bw - это ID блока, в который может быть вставлена картинка (он есть в коде)... я хочу регулировать его высоту с помощью дополнительного класса css

Тогда в нужный момент проверяй есть ли в том элементе картинка... Если есть - устанавливай ему нужный класс.

Цитата:

Сообщение от ksa (Сообщение 447431)

Тогда в нужный момент проверяй есть ли в том элементе картинка... Если есть - устанавливай ему нужный класс.

Абсолютно верно - это я и хочу сделать... только не знаю как...

Цитата:

Сообщение от Igorsrt

это я и хочу сделать... только не знаю как...

Как вариант...

<div class="browser_width colelem" id="u25210-bw">
 <div>
   <!-- biggest banner -->
  <a href="/" target="_blank">
    <div id="banner-biggest" alt="на главной" style="background-image: url('/58c0847705f64.jpg');min-height: 367px;background-color: rgb(0, 0, 0);background-position: center bottom;background-repeat: no-repeat;background-size: cover;">
    </div>
  </a>
 </div>
</div>
<script>
var o=document.querySelector('#u25210-bw img');
alert(o);
</script>

а класс тут где присваивается?... что-то я не въезжаю:(

Цитата:

Сообщение от Igorsrt

а класс тут где присваивается?

Анализируй значение переменной и делай соответствующие преобразования...

Цитата:

Сообщение от ksa (Сообщение 447439)

Анализируй значение переменной и делай соответствующие преобразования...

тяжело для меня пока что... (

сам класс я примерно знаю как добавить можно:

$('#u25210-bw').addClass('my-class');

... а как это с условиями связать?

вот так вот сделал:

$('#u25210-bw').has( "#banner-biggest" ).addClass('my-class');

Правильно? ;)

<div class="browser_width colelem" id="u25210-bw">
 <div>
   <!-- biggest banner -->
  <a href="/" target="_blank">
    <div id="banner-biggest" alt="на главной" style="background-image: url('/58c0847705f64.jpg');min-height: 367px;background-color: rgb(0, 0, 0);background-position: center bottom;background-repeat: no-repeat;background-size: cover;">
    </div>
  </a>
 </div>
</div>
<script>
if ($('#u25210-bw img').length>0) {
   $('#u25210-bw').addClass('my-class');
};
</script>

Цитата:

Сообщение от Igorsrt (Сообщение 447444)

вот так вот сделал:

$('#u25210-bw').has( "#banner-biggest" ).addClass('my-class');

Правильно? ;)

только я хочу теперь наоборот - что бы класс добавлялся, если нет дочернего элемента #banner-biggest ... как это сделать, помогите?

Не эксперт в jQuery, но наверное как-то так:

$('#u25210-bw:not(:has(#banner-biggest))').addClass('my-class');

Или так:

$('#u25210-bw').find('#banner-biggest').closest('#u25210-bw').addClass('my-class');