3D 터치로 최신 iPad에서 이미지 및 링크 드래그 방지

Question

웹 페이지의 요소 테이블을 길게 누르기 위해 구현하고 있습니다.

Android 및 iOS의 다양한 긴 메뉴와 브라우저 간 터치 기능의 차이로 인해이 기능은 매우 어렵습니다.

기본적으로 이미지와 링크가 포함 된 div 태그 인 차단 항목이 있습니다. 부모 블록 항목을 드래그 할 수 있어야합니다.

최신 iPads에서 Safari를 사용하면 웹 페이지에서 이미지 또는 링크를 드래그 할 수 있습니다. 이렇게하면 부모 블록 드래그가 시작되고 블록 내의 이미지가 분리되어 드래그 할 수 있기 때문에 드래그 앤 드롭이 엉망이됩니다.

다른 스택 오버 플로우 게시물에서 다음 CSS를 권장했습니다. 포함 된 모든 하위 요소, 링크 및 이미지에 적용했지만 이미지와 링크는 여전히 분리되어 있으며 최신 ipads에서 드래그 할 수 있습니다.

3D 터치로 최신 iPad에서 이미지 및 링크를 길게 눌러 드래그 앤 드롭하지 않도록하려면 어떻게해야합니까?

.drag-parent-wrapper * { 
    @include user-select(none); 
    -webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 

    -webkit-touch-callout: none; 
    -ms-text-size-adjust: none; 
    -webkit-text-size-adjust: none; 
    -webkit-tap-highlight-color: rgba(0,0,0,0); 
} 

이 작업은 수행 할 수 없습니다. 새로운 아이 패드에서 드래그 가능한 상태로 남아있는 모든 자식 img 및 링크 요소에 재귀 적으로 적용되는지 확인했습니다.

기본적으로 터치 또는 마우스 이벤트를 차단할 수 없거나 장치의 전반적인 기능에 위험이 있습니다.

Answer 1

간단 :

IMG 드래그 = "false"를 SRC = "image.png를"ALT = "이미지 설명"

에서 :

http://www.denisbouquet.com/css-forbid-selection-user-select-dragging-ghost-image/