←イメージの長押しとクリックとが区別して検出できる
test.html←この上でmousedownし、範囲外にmousemoveするとスクロールしない
// 感触パラメータ
DSDragThresh =4; // Mousedownの位置からこの距離離れたらドラッグ開始とみなす
DSFillipThresh =10; // 一度にこの距離以上mouseが移動したら慣性スクロールが始まる
DSFillipBrake =0.5; // interval毎の慣性スクロール減衰量
DSFillipAccel =5; // 慣性スクロールの初期加速係数
DSInterval =50; // interval(msec) 小さいと負荷は重いがスクロールが滑らかに
DSLongPressThresh=20; // DSLongPressThresh*DSInterval(msec)で長押しが発生
// 長押し検出
DSLongPressID="false"; // 長押し時に渡るID文字列
// 内部変数
DSPress = false;
DSDragging = false;
DSLongPress= false;
DSCount =0;
DSDownX =0; // mousedownしたときの座標
DSDownY =0;
DSLastX =0; // mousemove前回したときの座標
DSLastY =0;
DSdX =0; // mousemove毎の移動距離
DSdY =0;
DSddX =0; // 慣性スクロール量
DSddY =0;
window.document.onmousedown=DSMousedown;
window.document.onmousemove=DSMousemove;
window.document.onmouseup =DSMouseup;
setInterval("DSTimer()",DSInterval);
function DSMousedown()
{
DSDragging = false;
DSPress = true;
DSLongPress= false;
DSDownX = event.screenX;
DSDownY = event.screenY;
DSddX = 0;
DSddY = 0;
DSCount = DSLongPressThresh;
}
function DSMousemove()
{
DSdX=DSLastX-event.screenX;
DSdY=DSLastY-event.screenY;
DSLastX=event.screenX;
DSLastY=event.screenY;
if(DSPress)
{
if(!DSDragging)
{
if(Math.abs(DSDownX-DSLastX)>DSDragThresh || Math.abs(DSDownY-DSLastY)>DSDragThresh)
{
DSDragging=true;
}
}
else
{
window.scrollBy(DSdX,DSdY);
}
// 慣性スクロール
if(Math.abs(DSDownX-DSLastX)>DSFillipThresh) { DSddX=DSdX*DSFillipAccel; }
if(Math.abs(DSDownY-DSLastY)>DSFillipThresh) { DSddY=DSdY*DSFillipAccel; }
}
}
function DSMouseup()
{
DSPress=false;
DSLongPress=false;
DSLongPressID="false";
if(!DSDragging && DSCount == 0) { DSLongPress = true; }
}
function DSBrake(x)
{
dx=Math.abs(x)-DSFillipBrake;
if(dx<1) return 0;
if(x>0) return dx;
return -dx;
}
function DSSetLongPress(id)
{
DSLongPressID=id;
}
function DSTimer()
{
//慣性スクロール
window.scrollBy(DSddX,DSddY);
DSddX=DSBrake(DSddX);
DSddY=DSBrake(DSddY);
// 長押しカウント
if(DSCount>0)
{
if(!DSPress || DSDragging) { DSCount=1; }
DSCount--;
}
if(DSCount==1)
{
DSLongPress=true;
imagelongpress()
DSCount=0;
}
}
function imagelongpress()
{
if(DSLongPressID == "false") return;
item1.alt=DSLongPressID+"is pressed long";
}
function clicktest(itemname)
{
if(DSLongPress) return;
item1.alt=itemname+"is clicked";
}