[DDSSDD]

Блин, что то я запарился с элементарной ситуевиной...

Есть схема (картинка jpg) в div-е. Картинка фоновая и задана через background-size: cover.
В этом диве расставлены подсказки по схеме (тоже div-ы c одинаковыми ID).
Все работает просто - наводишь курсор на подсказку, cover - сбрасывается и фоновая схема позиционируется увеличивая то место, где стоит подсказка.

Задача в том, что бы при наведении на одну подсказку другие скрывать.

Казалось бы чего там, CSS :hover и всего делов то.
Но если с помощью CSS то нужно каждому div-у с подсказкой давать уникальный ID и перебирать их все, описывая каждое событие.
Более того, в таком варианте я не могу получить доступ (скрыть) к тем div-ам, которые стоят выше в коде по событию элемента который ниже в коде.

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

Думаю нужно написать функцию, логику, и запускать ее по событию на каждой подсказке.

Вот только как это сделать с одинаковыми ID и не затрагивать активный элемент (у которого такой же ID) на который в данный момент наведен курсор?

<div id="combox">

<div class="cont"></div>

<div class="cont"></div>

<div class="cont"></div>

</div>

Пробовал и так:

(function() {
    var switcher = $('[class *= "cont"]'),
         target = $('#combox div');
    
    switcher.hover.not(this)(
        function() { target.hide(); },
        function() { target.show(); }
    );
})();

И так:

var imgid;
$('.cont').mouseenter(function(){
imgid = this.id;
$('.cont').each(function(){
if(this.id==imgid) $(this).stop(false,true).css('visibility', 'hidden');
else $(this).stop(false,true).css('visibility', 'visible');
});
});

В общем подскажите плиз.. Вопрос видать детский совсем...