Как правильно находить родителя?

Question

[Капитан Какао]

В общем есть такая конструкци

При наведении курсора на красную сторону она расширяется а правая сужается, и на оборот.
Всё работает как нужно.
Но если добавить в HTML ещё одну такую же конструкцию, то она тоже будет расширятся.
Подскажите, как искать родителя, что бы при наведении расширялась только та сторона на которую наведён курсор, а не все которые есть на странице.

Ведь не писать же для каждого блока отдельный скрипт.

Answer 1

[Дмитрий]

https://api.jquery.com/closest/

можно более красиво написать, но для примера...

$('.left').hover(function() {
    $(this).closest('.dubSec').find('.left').toggleClass('open');
    $(this).closest('.dubSec').find('.right').toggleClass('close');
});

Comments

[Капитан Какао]

Благодарю.

Answer 2

[Pavel O]

родитель на один уровень наверх $(this).parent()
родитель на сколько угодно уровней наверх до указанного $(this).parent('родитель')
во втором случае лучше сделать $(this).parent('родитель').eq(0) если родителей с таким именем много

Answer 3

[Александр Таратин]

Без js
https://jsfiddle.net/QW01_01/9oe4ne1t/1/

Comments

[Капитан Какао]

Этот вариант не совсем подходит. Так как там по мимо самих блоков ещё в нутри есть элементы которые тоже растягиваются.
Да и типа при наведении на одну сторону она увеличивается, а на другой которая уменьшается появляется блок полупрозрачный с position:absolute, что бы типа маленькую сторону затмить и всё внимание было на большую... В общем я начале я так и думал сделать ячейками, но в пришёл к js

[Александр Таратин]

Rad Cor: Ну и в чем проблема?
>появляется блок полупрозрачный с position:absolute,
Что не получается?

[Капитан Какао]

Александр Таратин: фишка в том, что при наведении на левый блок, полупрозрачный должен появляться на правом блоке.
То есть эффект происходит не с тем элементом на который мы наводим курсор, а с соседним.

[Александр Таратин]

Rad Cor: Не вижу проблем https://jsfiddle.net/QW01_01/9oe4ne1t/3/

[Александр Таратин]

Rad Cor: Для ie правда нужно немного поправить растяжение черного блока, но с этим и сами справитесь.

[Капитан Какао]

Александр Таратин: блин, я как-то не додумался до такого)) Спасибо конечно за интересное решение. Но я пытаюсь освоит js, по этому все поставленные задачи стараюсь решить с помощью него а не css)