나는 여기를 잃고있다. jQuery UI 드래그 가능한 기반 draggable 응용 프로그램을 아주 잘 작동합니다. 그것은 내가 원하는 모든 것을하고 있습니다. 그러나 이미지 드래그를 할 때 이미지를 바탕 화면이나 다른 브라우저 탭으로 드래그 앤 드롭 할 수있는 기본 브라우저 기능은 항상 이미지를 클릭하고 조금 드래그해야한다는 것을 의미합니다. 드래그 할 수있게하려면 클릭하고 다시 드래그하십시오. 나는 내가 이런 일이 일어나지 않고 이미지를 끌 수있는 사이트를 보았다.jQuery UI Draggable - 브라우저 이미지 끌기를 방지하는 방법 (바탕 화면으로)
Here is a brief video showing you what is happening - 동영상에서 드래그 인 에이 블러가 초록색으로 변할 때 첫 번째 클릭에서 나는 이미지를 잡고 모든 것을 끌고 있습니다. 바탕 화면과 탭 막대에이 이미지를 놓아 새 탭에서 열 수있는 브라우저 동작입니다. 두 번째로 이미지를 클릭하고 위아래로 슬라이드하고 함수 호출에 정의 된대로 수직 축에만 구속시킵니다.
I've tried just about everything on this page 및 그 외 모든 것들은 드래그하려는 방식을 비롯하여 이미지의 드래그를 전혀 사용하지 않는 경향이 있습니다. 또한 각 이미지 주위에 div를 추가 했으므로 아무 것도 변경되지 않습니다. 어떤 아이디어?
여기 내 코드입니다 :
//Accessories dragging
var $drag_contain = $('#current_build');
$(document).on('drag', '.drag', function(ev,dd) {
$(this).draggable({
disabled: false,
axis: "y",
stop: function(event, ui) {
//when dragging is done, remove ability to drag
$(this).css('z-index','5').removeClass('drag').draggable('disable');
}
});
});
여기
<div id="current_build">
<div class="10117" style="z-index:2;top:0px;left:0px;"><img src=
"/assets/images/config_combos_sized/bas_18invhrcfootpedal.png" /></div>
<div class="10124" style="z-index:3;top:0px;left:0px;"><img src=
"/assets/images/config_combos_sized/col_47_5inshortvhrc.png" /></div>
<div class="10356" style="z-index:1;top:0px;left:0px;"><img src=
"/assets/images/config_combos_sized/cas_4intwin_18invhrc.png" /></div>
<div class="10362" style="z-index:4;top:-27px;left:0px;"><img src=
"/assets/images/config_combos_sized/dm_dualmonitormount.png" /></div>
<div class="10374" style="z-index:5;top:34px;left:0px;"><img src=
"/assets/images/config_combos_sized/acc_dividedutilitybin.png" /></div>
는 분명 내가이 시점에서 이미지 주위 DIV의의가있는 HTML을합니다.