2017-09-13 21 views
9

प्लगइन को "रीफ्रेश करने के लिए खींचें" बहुत सारे हैं। मैंने पहले से ही उनमें से 5 का परीक्षण किया है। लेकिन उनमें से कोई भी तेजी से चल रहा है (विशेष रूप से पुराने स्मार्टफोन पर)।रीफ्रेश करने के लिए पुल का पता लगाने के लिए

रीफ्रेश करने के लिए खींचने के लिए सबसे अच्छा (बटररी यूएक्स प्रदर्शन और प्रतिक्रिया) तरीका क्या है?

पीएस: मुझे किसी भी एनीमेशन की आवश्यकता नहीं है। मैं तो बस यदि कोई उपयोगकर्ता

+0

'नहीं चल रहे हैं मदद कर सकता है? अक्सर पर्याप्त खींच नहीं है? पुल बहुत लंबा लगता है? यदि उत्तरार्द्ध, संभावना है हार्डवेयर हार्डवेयर –

+0

है यह हमेशा थोड़ा झटके। 100% मूल भावना नहीं है। – Peter

+0

यदि आप चाहते हैं, तो अधिक कोड प्राप्त न करें, आप स्वाइप जेश्चर सूचीकार – GeekWithGlasses

उत्तर

4

प्रदर्शन न्यूनतम कोड

प्लगइन्स की आवश्यकता है और पुस्तकालयों कई संबंधित समस्याओं को हल करने के क्रम में के रूप में लचीला और संभव के रूप में सामान्य हो सकता है, लिखा जा करने के लिए है "ताज़ा करने के लिए खींच" पहचान करने के लिए चाहते हैं। इसका मतलब यह है कि प्रदर्शन की प्रभाव डालने के कारण वे हमेशा आपकी आवश्यकता से अधिक थोक होंगे। इसका मतलब यह भी है कि आपको उस कोड को बनाए रखना कभी नहीं होगा। वह व्यापार बंद है।

यदि प्रदर्शन आपका लक्ष्य है, तो इसे स्वयं बनाएं।

चूंकि आपको केवल एक पुल-डाउन डिटेक्शन की आवश्यकता है, एक सरल स्वाइप डिटेक्टर बनाएं। बेशक, आपको इसे अपनी आवश्यकताओं, और घटना-गुणों, ओएस और ब्राउज़र के ईवेंट-ट्रिगर्स को लक्षित करना होगा, जिन्हें आप लक्षित कर रहे हैं।

मेरे पुराने js-minimal-swipe-detect

var pStart = {x: 0, y:0}; 
var pStop = {x:0, y:0}; 

function swipeStart(e) { 
    if (typeof e['targetTouches'] !== "undefined"){ 
     var touch = e.targetTouches[0]; 
     pStart.x = touch.screenX; 
     pStart.y = touch.screenY; 
    } else { 
     pStart.x = e.screenX; 
     pStart.y = e.screenY; 
    } 
} 

function swipeEnd(e){ 
    if (typeof e['changedTouches'] !== "undefined"){ 
     var touch = e.changedTouches[0]; 
     pStop.x = touch.screenX; 
     pStop.y = touch.screenY; 
    } else { 
     pStop.x = e.screenX; 
     pStop.y = e.screenY; 
    } 

    swipeCheck(); 
} 

function swipeCheck(){ 
    var changeY = pStart.y - pStop.y; 
    var changeX = pStart.x - pStop.x; 
    if (isPullDown(changeY, changeX)) { 
     alert('Swipe Down!'); 
    } 
} 

function isPullDown(dY, dX) { 
    // methods of checking slope, length, direction of line created by swipe action 
    return dY < 0 && (
     (Math.abs(dX) <= 100 && Math.abs(dY) >= 300) 
     || (Math.abs(dX)/Math.abs(dY) <= 0.3 && dY >= 60) 
    ); 
} 

document.addEventListener('touchstart', function(e){ swipeStart(e); }, false); 
document.addEventListener('touchend', function(e){ swipeEnd(e); }, false); 
+0

लागू कर सकते हैं, मुझे लगता है कि यह वही है जो मैं ढूंढ रहा हूं। लेकिन मुझे एक त्रुटि मिलती है "abs परिभाषित नहीं किया गया है":/ – Peter

+2

@ पीटर परिवर्तन 'abs') 'Math.abs()' –

+0

@KScandrett, इसके लिए धन्यवाद। मेरे हिस्से पर खराब निगरानी। –

0

से सरलीकृत तुम थक गए इन समाधानों है ?? आप इस fiddle

var mouseY = 0; 
var startMouseY = 0; 
$('body').on('mousedown', function (ev) { 
    mouseY = ev.pageY; 
    startMouseY = mouseY; 
    $(document).mousemove(function (e) { 
     if (e.pageY > mouseY) { 
      var d = e.pageY - startMouseY; 
      console.log("d: " + d); 
      if (d >= 200) 
       location.reload(); 
      $('body').css('margin-top', d/4 + 'px'); 
     } 
     else 
      $(document).unbind("mousemove"); 


    }); 
}); 
$('body').on('mouseup', function() { 
    $('body').css('margin-top', '0px'); 
    $(document).unbind("mousemove"); 
}); 
$('body').on('mouseleave', function() { 
    $('body').css('margin-top', '0px'); 
    $(document).unbind("mousemove"); 
}); 

जांच करने की जरूरत है और आप देख रहे हैं कुछ प्लगइन के लिए this plugin आप क्या अर्थ में fast`

+0

@ mr-pyramid जोड़ें, अधिकांश मोबाइल डिवाइस स्पर्श के लिए किसी भी' माउस ** 'ईवेंट रिकॉर्ड नहीं करते हैं। यह बिना किसी स्पर्श के डेस्कटॉप या लैपटॉप के लिए ठीक काम करेगा, लेकिन एंड्रॉइड, आईओएस, या विनफोन डिवाइस के लिए काम नहीं करेगा। –

+0

क्या आपका उत्तर एंड्रॉइड और मोबाइल उपकरणों के लिए मुद्दों को हल करता है? –

+1

यह _should_ अधिकांश मोबाइल उपकरणों पर काम करता है, लेकिन मूल (अधिक भारी) कोड जिसमें से मैंने इस समाधान को बनाया है, केवल एंड्रॉइड में 2 ब्रॉवर, पीसी पर 5 और मैक पर 2 ब्रॉवर्स पर परीक्षण किया गया है। आपका समाधान _ किसी भी स्पर्श क्रियाओं के साथ काम नहीं करेगा जो समस्या ओपी हल करने के लिए कह रही थी। –

संबंधित मुद्दे