Javascript - привязать к элементам за другим элементом?

Question

Скажем, у меня есть два div:

<div id="container1"></div>
<div id="container2"></div>

И сказать, что оба divs имеют одинаковую ширину и высоту и находятся друг над другом, с #container2 быть на вершине другого (то есть z-index из #container2 выше).

Есть ли в любом случае, чтобы ваша мышь была привязана к элементу внизу (#container1)?

Я спрашиваю это, потому что в моей ситуации, #container2 частично блокирует части #container1; поэтому там, где нет перекрытия, у меня нет проблем с привязкой, но когда есть перекрытия, то я не могу связать

РЕДАКТИРОВАТЬ В частности, #container1 это график, и #container2 это конкретное задание, которое начинается, скажем, с 9:00 до 12:00. Я хочу, чтобы можно было перетащить задачу в другое время. Поэтому я хочу привязать к временной шкале (#container1).

Answer 1

Вы могли бы добавить pointer-events:none к элементу.

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

#container2 {
    z-index:2;
    pointer-events:none;
}

Просто примите во внимание поддержку собственности.

Answer 2

На div, который по сравнению с другим использованием

css
    #a{
        pointer-events:none;
    }



<div id='a'>on top</div>
<div id='b'>under</div>

jsfiddle