使用Javascript模拟滚动事件
我正在尝试使用Javascript for Mobile Safari模拟滚动事件。 我正在使用下面的代码
var evt = document.createEvent("MouseEvents");
evt.initMouseEvent("scroll", true, true, window,0, 0, 0, 0, 0, false, false, false, false, 0, null);
上面的代码是jQuery插件jQuery.UI.Ipad的一部分，它基本上将touchstart，touchmove，touchend等触摸事件映射到mouseover，mousedown等鼠标事件
由于某些原因，模拟滚动事件的代码无法正常工作......请帮助我。 所以基本上我的问题是如何模拟滚动事件。 谢谢。
我认为人们对你为什么会忽略滚动控制感到困惑。 我可以看到你为什么要模仿鼠标事件，但滚动可能不应该是其中之一。
通常对于滚动更改，您可以通过以下方式获取滚动条：
var top = document.body.scrollTop;
并设置：
document.body.scrollLeft = sX;
document.body.scrollTop = sY;
所以，我知道我也需要模拟它。 对我来说，这是当你有一个水箱的灯箱，你会需要它。 我能想到的只有很多例子。 寻找答案。 只是以为我会分享我在哪里，你没有与jQuery.Ui.Ipad我会谷歌那..但这是我到目前为止，并且工作，但不完美。
var inTouch=false;
var timers_arr = new Array();
var c=0;
var t;
var timer_is_on=0;
//-------------------------------------------------------------------------------------------------------------------------------------------------------------
// jeremy's timer functions
//-------------------------------------------------------------------------------------------------------------------------------------------------------------
function clearCount(timer){
/// clear the time from timer
clearTimeout(timers_arr[timer]);
/// Make sure it's clear
timers_arr[''+timer+'']=0;
delete timers_arr[''+timer+''];
}
function setCount(timer,time,func){
clearCount(timer);
if(timers_arr[timer]==0||typeof(timers_arr[timer]) === 'undefined'){
timers_arr[timer]=setTimeout(function(){
func();
},time);
}
}
function updatePos(evt,startY){
setCount('touchmove',1,function(){
var orig = evt.originalEvent;
var curY = orig.changedTouches[0].pageY;
var y = curY - startY;
var sliderVal = $("#slider-vertical").slider("value");
sliderVal += (y*.008);
$("#slider-vertical").slider("value", sliderVal);
updatePos(evt,startY);
});
setCount('touchmove_anitMotion',200,function(){
clearCount('touchmove');
clearCount('touchmove_anitMotion');
});
}
var startX=0;
var startY=0;
var x=0;
var y=0;
var direction='';
$('body').bind("onorientationchange", updateOrientation, false);
$('#scroll-pane').live("touchstart", function(evt){
inTouch=true;
startX = event.targetTouches[0].pageX;
startY = event.targetTouches[0].pageY;
});
$('#scroll-pane').live("touchmove", function(evt){
evt.stopPropagation();
evt.preventDefault();
updatePos(evt,startY);
});
$('#scroll-pane').live("touchend", function(evt){
startX=0;
startY=0;
clearCount('touchmove');
inTouch=false;
});
$('#scroll-pane').live("touchcancel", function(evt){
startX=0;
startY=0;
clearCount('touchmove');
inTouch=false;
});
再次不完美，并寻求解决它..但它至少工作。 现在请注意，这是一个使用jQuery UI滑动条作为滚动条的div（在我的视图中它是垂直的），显示在
http://jqueryui.com/demos/slider/#side-scroll
希望刺激一些想法。 如果我得到一个超级稳定的答案，我会回来。 干杯 - 杰瑞米
我需要这个编写一个单元测试，为此我需要模拟一个滚动事件
function dispatchScroll(target,newScrollTop) {
target.scrollTop = newScrollTop;
var e = document.createEvent("UIEvents");
// creates a scroll event that bubbles, can be cancelled,
// and with its view and detail property initialized to window and 1,
// respectively
e.initUIEvent("scroll", true, true, window, 1);
target.dispatchEvent(e);
}
有关更多详细信息，请访问：https：//developer.mozilla.org/en-US/docs/Web/API/event.initUIEvent
链接地址: http://www.djcxy.com/p/95577.html