передвигаться за элементом - PullRequest
Новая
       7

передвигаться за элементом

0 голосов
/ 27 ноября 2018

У меня есть перетаскиваемый элемент и не перетаскиваемый элемент с более высоким z-индексом.Если я перетаскиваю перетаскиваемый элемент поверх не перетаскиваемого объекта, он исчезает за ним, и это нормально.

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

$('#draggable').draggable({stack: 'span'});
#draggable {
  color: white;
  background-color: black;
  z-index: 50;
 }
 
 #element
 {
  width: 100px;
  height: 100px;
  background-color: rgb(0, 0, 255, 0.5);
  z-index: 100;
  position: absolute;
  }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<span id="draggable">Drag Me</span>
<div id="element"></div>

Есть ли способ добиться этого?

1 Ответ

0 голосов
/ 27 ноября 2018

Добавление атрибута CSS pointer-events: none; к не перетаскиваемому объекту заставляет все обработчики событий вызывать не сам объект, а объекты позади. 

$('#draggable').draggable({stack: 'span'});
#draggable {
  color: white;
  background-color: black;
  z-index: 50;
 }
 
 #element
 {
  width: 100px;
  height: 100px;
  background-color: rgb(0, 0, 255, 0.5);
  z-index: 100;
  position: absolute;
  pointer-events: none;
  }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<span id="draggable">Drag Me</span>
<div id="element"></div>
...