Как получить родительский элемент с определенным CSS-свойством?

Question

[ymfront]

Определяю родительский элемент так:

var parent = $(".element").parent();

Но мне нужно в parent записать родителя, который имеет свойство "position: relative".

Например, есть такая HTML-структура:

<div class="wrapper">
    <div class="inner">
        <div class="element"></div>
    </div>
</div>

Например, если блок.inner имеет свойство "position: relative", то в parent записываем .inner. Но если .inner не имеет такого свойства, то нужно подняться выше и проверить свойство для .wrapper, и записать в parent .wrapper, если оно имеет свойство "position: relative".

Нужно сделать на jQuery.

Comments

[Вадим]

У Вас что, два элемента с одинаковым классом имеют разные стили? Там что, через родительский селектор определяется position?
Вопрос звучит так что у вас прям не очень хорошо сделано всё и лучше переделать, чем делать такой костыль.

[ymfront]

Где вы увидели 2 элемента с одинаковым классом и разными стилями? В html-коде видно, что все 3 дива - wrapper, inner и element.

[Ankhena]

Цель-то какая?

[ymfront]

Ankhena, определять position относительно блока с position: relavive

[imko]

ymfront,

Где вы увидели 2 элемента с одинаковым классом и разными стилями?

если блок.inner имеет свойство "position: relative", то в parent записываем .inner

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

[ymfront]

imko, не могу понять, где вы видите, что я где-то задаю класс?

Answer 1

[Сергей delphinpro]

определять position относительно блока с position: relavive

Вот об этом и нужно было спрашивать, а не выдумать что-то...

Для определения позиции элемента в jquery уже есть методы.

https://api.jquery.com/offset/
https://api.jquery.com/position/

Comments

[Lynn «Кофеман»]

Ну и https://api.jquery.com/offsetparent/ если таки надо найти родителя

[ymfront]

Lynn «Кофеман», как определить позицию, я и сам знаю ) Мне нужно определить позицию именно относительно самого первого родителя с условием, что он имет свойство - position: relative. Например, у нас есть 4 родителя:

<div class="parent4">
    <div class="parent3">
        <div class="parent2">
             <div class="parent1">
                 <div class="element"></div>
             </div>
        </div>
    </div>
</div>

И если parent1 имеет position: relative, то определяем позицию относительно него. Если же parent1, parent2, parent3 не имеют position: relative, а parent4 имеет, то определяем позицию относительно parent4.

[Сергей delphinpro]

ymfront, вы прочитайте информацию по ссылкам, которые я вам дал.

spoiler

метод position() как раз это и делает.

[ymfront]

Сергей delphinpro, здесь более понятно описано https://basicweb.ru/jquery/jquery_method_position.php
Я сразу неправильно понял суть метода, значит определять родителя не нужно. Спасибо )

[ymfront]

Сергей delphinpro, Но мне все равно нужно записать в parent самого родителя с position: relative, чтобы определить не только top и left, но и рассчитать right и bottom

[Сергей delphinpro]

ymfront, как найти родителя вам Lynn «Кофеман» подсказал выше.

Но и это необязательно. Что такое right? Это left + width

[ymfront]

Сергей delphinpro, Это как? right - это parent_width - left - width.
Например, ширина родителя - 1000px, ширина элемента - 100px, left - 200px
По вашему right будет 300px, а на самом деле - 700px.

[Сергей delphinpro]

ymfront, ага, верно. я не так понял.

Answer 2

[ymfront]

Как оказалось, все намного проще, чем казалось.
Именно для этого есть метод .offsetParent()