4
아래 jsfiddle를 참조하십시오 작동하지 않습니다. 스크롤 막대를 사용하여 목록을 스크롤 할 수 있으며 목록 스크롤없이 상자를 클릭하여 끌 수 있습니다.제대로
iPad에서이 목록을 스크롤하려고하면 문제가 발생합니다. 목록의 상자를 터치 할 때마다 이미 드래그 가능으로 설정되어 있으므로 목록을 스 와이프하여 드래그 앤 드롭 할 수 없습니다.
아무에게도 내가 어떻게 작동시킬 수있는 제안이 있습니까? 대체 솔루션일까요?
미리 감사드립니다.
HTML :
<div id="scroller">
<div class="color" style="background-color: rgb(107, 163, 93);" data-r="107"
data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
<div class="color" style="background-color: rgb(107, 163, 93);"
data-r="107" data-g="163" data-b="93"></div>
</div>
CSS :
#scroller {
width: 317px;
height: 325px;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}
.color {
margin:5px;
width: 100px;
height: 100px;
}
JS :
$(".color").draggable({
scroll: false,
helper: "clone",
});