एक शुरुआत के रूप में अपने दूसरे बेला से उदाहरण का उपयोग करना, आप ऐसा कर सकता है:
//From the fiddle
var supportTouch = $.support.touch,
scrollEvent = "touchmove scroll",
touchStartEvent = supportTouch ? "touchstart" : "mousedown",
touchStopEvent = supportTouch ? "touchend" : "mouseup",
touchMoveEvent = supportTouch ? "touchmove" : "mousemove";
$.event.special.swipeupdown = {
setup: function() {
var thisObject = this;
var $this = $(thisObject);
$this.bind(touchStartEvent, function(event) {
var data = event.originalEvent.touches ?
event.originalEvent.touches[ 0 ] :
event,
start = {
time: (new Date).getTime(),
coords: [ data.pageX, data.pageY ],
origin: $(event.target)
},
stop;
function moveHandler(event) {
if (!start) {
return;
}
var data = event.originalEvent.touches ?
event.originalEvent.touches[ 0 ] :
event;
stop = {
time: (new Date).getTime(),
coords: [ data.pageX, data.pageY ]
};
// prevent scrolling
if (Math.abs(start.coords[1] - stop.coords[1]) > 10) {
event.preventDefault();
}
}
$this
.bind(touchMoveEvent, moveHandler)
.one(touchStopEvent, function(event) {
$this.unbind(touchMoveEvent, moveHandler);
if (start && stop) {
if (stop.time - start.time < 1000 &&
Math.abs(start.coords[1] - stop.coords[1]) > 30 &&
Math.abs(start.coords[0] - stop.coords[0]) < 75) {
start.origin
.trigger("swipeupdown")
.trigger(start.coords[1] > stop.coords[1] ? "swipeup" : "swipedown");
}
}
start = stop = undefined;
});
});
}
};
$.each({
swipedown: "swipeupdown",
swipeup: "swipeupdown"
}, function(event, sourceEvent){
$.event.special[event] = {
setup: function(){
$(this).bind(sourceEvent, $.noop);
}
};
});
और फिर
$('.scrollbar').on('swipedown', function(){
var SCROLL_FRACTION = 3;
var height = document.body.scrollHeight;
var width = document.body.scrollWidth;
scrollTo(width, height - height/SCROLL_FRACTION);
});
$('.scrollbar').on('swipeup', function(){
var SCROLL_FRACTION = 3;
var height = document.body.scrollHeight;
var width = document.body.scrollWidth;
scrollTo(width, height + height/SCROLL_FRACTION);
});
जोड़ने और फिर आप बस पृष्ठ के जो भी अंश को SCROLL_FRACTION
बदल सकते हैं जब आप स्वाइप करते हैं तो आप स्क्रॉल करना चाहते हैं।
मोबाइल उपकरणों पर स्क्रॉल बार के बारे में आपको परेशान क्यों हैं? संपूर्ण बिंदु यह है कि स्वाइप करना स्वाभाविक है - स्क्रॉल बार हमारे लिए औसत आकार के हाथों/अंगुलियों के साथ किसी भी तरह का उपयोग करने के लिए बहुत छोटे हैं –
@ डैरेन स्वीनी मैं एक एप्लिकेशन का उपयोग कर रहा हूं जो मुझे एक HTML फ़ाइल देता है और मुझे इसे शामिल करना होगा
मैंने iscroll (http://cubiq.org/iscroll-5) या अन्य लिखित स्क्रॉल बार का प्रयास किया है, लेकिन मैं उन्हें iframe –