JQuery स्क्रॉल करने के लिए प्लगइन आईओएस पर जेर्की बन जाता है

Question

मैं विभिन्न अनुभागों के बीच लंबवत स्क्रॉल करने के लिए हमारे one-page site पर JQuery scrollTo plugin का उपयोग कर रहा हूं।

स्क्रॉल को छोड़कर सभी ब्राउज़रों में अच्छी तरह से काम करता है आईओएस सफारी जो स्क्रॉल करता है लेकिन बहुत झटकेदार है। मैं पृष्ठ पर कई अन्य Jquery प्लगइन्स का उपयोग कर रहा हूं, इसलिए यह इनमें से किसी एक के साथ संघर्ष हो सकता है।

यदि कोई स्क्रॉल करने का विकल्प जानता है तो यह आईपैड पर आसानी से काम करता है या सुझाव दे सकता है कि इस मुद्दे से निपटने के लिए कहां से मदद करें। मैंने this solution की कोशिश की है लेकिन सफलता के बिना।

Answer 1

टिप अरनार के लिए धन्यवाद।

आपकी सलाह मुझे सही रास्ते पर रखती है और this JSFiddle की मदद से अब मेरे पास प्रत्येक अनुभाग में चिकनी एनिमेटेड स्क्रॉल के साथ smooth scroll i wanted to achieve है और सक्रिय मेनू आइटम की स्वचालित हाइलाइटिंग है।

// Cache selectors 
var lastId, 
    topMenu = $("#top-menu"), 
    topMenuHeight = topMenu.outerHeight()+15, 
    // All list items 
    menuItems = topMenu.find("a"), 
    // Anchors corresponding to menu items 
    scrollItems = menuItems.map(function(){ 
     var item = $($(this).attr("href")); 
     if (item.length) { return item; } 
    }); 

// Bind click handler to menu items 
// so we can get a fancy scroll animation 
menuItems.click(function(e){ 
    var href = $(this).attr("href"), 
     offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1; 
    $('html, body').stop().animate({ 
     scrollTop: offsetTop 
    }, 300); 
    e.preventDefault(); 
}); 

// Bind to scroll 
$(window).scroll(function(){ 
    // Get container scroll position 
    var fromTop = $(this).scrollTop()+topMenuHeight; 

    // Get id of current scroll item 
    var cur = scrollItems.map(function(){ 
    if ($(this).offset().top < fromTop) 
     return this; 
    }); 
    // Get the id of the current element 
    cur = cur[cur.length-1]; 
    var id = cur && cur.length ? cur[0].id : ""; 

    if (lastId !== id) { 
     lastId = id; 
     // Set/remove active class 
     menuItems 
     .parent().removeClass("active") 
     .end().filter("[href=#"+id+"]").parent().addClass("active"); 
    }     
}); 

Answer 2

यह एक

$.scrollTo(SELECTOR, 800, { 
    'axis':'y' 
});