2012-08-13 30 views
5

मेरे पास jquery टूल स्क्रोलर है ... मुझे यह पसंद है कि स्वाइप लेफ्ट स्वाइप राइट के लिए केवल स्पर्श विकल्प लागू किया जाए।Jquery टूल्स क्षैतिज केवल स्पर्श लंबवत स्पर्श

जब मैं स्पर्श का उपयोग करें: सच है, यह घूमता करता है जब swipeUp/नीचे के रूप में अच्छी ..

मैं यहां दिए गए निर्देशों का पालन किया:

jQuery Tools Scrollable on touch disable vertical scroll

और यहाँ:

http://awardwinningfjords.com/2010/09/22/handling-touch-events-in-jquery-tools-scrollable.html

लेकिन कोई काम नहीं कर रहा .. कोई विचार? मेरी फिडल/डेमो संदर्भ के लिए नीचे है

बेला: http://jsfiddle.net/mmp2m/7/

डेमो: http://jsfiddle.net/mmp2m/7/show

धन्यवाद

उत्तर

5

केवल नियंत्रण आप उपयोग कर रहे स्क्रॉल तो आप संपादित कर सकता है उस व्यवहार को ठीक करने के लिए here से इसके लिए स्रोत कोड या फिट होने पर इसे अनुकूलित करें।

मैं संशोधित fiddle आप JavaScript कोड खंड में स्क्रॉल नियंत्रण के लिए कोड शामिल करने के लिए था।

// touch event 
    if (conf.touch) { 
     var touch = {}; 

     itemWrap[0].ontouchstart = function(e) { 
      var t = e.touches[0]; 
      touch.x = t.clientX; 
      touch.y = t.clientY; 
     }; 

     itemWrap[0].ontouchmove = function(e) { 

      // only deal with one finger 
      if (e.touches.length == 1 && !itemWrap.is(":animated")) {    
       var t = e.touches[0], 
        deltaX = touch.x - t.clientX, 
        deltaY = touch.y - t.clientY, 
        absX = Math.abs(deltaX),        // added 
        absY = Math.abs(deltaY);        // added 

       // Only consider the event when the delta in the 
       // desired axis is greater than the one in the other. 
       if(vertical && absY > absX || !vertical && absX > absY) // added 
        self[vertical && deltaY > 0 || !vertical && deltaX > 0 ? 'next' : 'prev'](); 

       e.preventDefault(); 
      } 
     }; 
    } 

मैं देशी और ओपेरा ब्राउज़र वाले Android में यह कोशिश की और लगता है की है:

लाइनों नियंत्रण के लिए कोड में जोड़ा टिप्पणी // added अंत में निम्नलिखित स्निपेट में साथ होते हैं उम्मीद के रूप में काम करने के लिए।

+0

मैंने कोड को संशोधित करने की कोशिश की लेकिन भाग्य के बिना ... मैंने 'डेल्टा = 0' और 'लंबवत और डेल्टा> 0 ||' सेट किया लेकिन' काम नहीं किया ... लेकिन आपका समाधान काम :) कर सकते हैं तुम मुझे बताओ || तथा ? क्या मतलब है? – MonteCristo

+0

'?' का उपयोग इनलाइन 'if' कथन व्यक्त करने के लिए किया जाता है, इसकी संरचना' बूलियन-एक्सप्र 'है? तब-expr: else-expr; '। '||' केवल तार्किक 'या' ऑपरेटर है जिसका उपयोग इनलाइन 'if' कथन के' बूलियन-एक्सप्र 'में किया जा रहा है। '?' ऑपरेटर पर अधिक जानकारी के लिए इस SO प्रश्न की जांच करें: http://stackoverflow.com/questions/10270351/how-to-write-a-inline-if-statement-in-javascript –

+1

थोड़ी सी बग जहां यह e.preventDefault(); स्वाइप किए जाने पर पेज को स्क्रॉल करना रोका ... निश्चित संस्करण यहां है http://jsfiddle.net/shavindra/nvyU8/4/ – MonteCristo

0

मैं थोड़ी देर के लिए एक ही मुद्दे के साथ संघर्ष कर रहा था जब तक मैं निम्नलिखित fix-

Initialization-

var $scroller1 = $('#outer-container1').kinetic({'y':false}); 

इस कंटेनर पर लंबवत स्क्रॉल से बचाता है, लेकिन करने के लिए लंबवत स्क्रॉल हाथ नहीं करता पाया ब्राउज़र स्क्रोलर।

फिर jquery kinetic स्रोत कोड पर जाएं और सभी माउस के लिए e.preventDefault() पर टिप्पणी करें और कार्रवाई घटनाओं को स्क्रॉल करें।

यह हैक मेरे लिए काम किया। https://github.com/davetayls/jquery.kinetic/issues/33