这个不适合家里的孩子。我会奖励那些接近解决方案的人。我已经包含了一个可以用来尝试修复问题的工作示例。这必须适用于iphone / android设备上的phonegap应用程序。我想做的很简单。我希望能够使用包含div中的“文本元素”滚动垂直。当我触摸右边的红色图像时，它们可以水平滚动。如果我向侧面滚动图像很好，但如果我一直按住手指并垂直滚动文本元素没有任何反应。我希望能够在按下图像元素时垂直滚动文本元素..请帮我解决这个问题：）
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style type="text/css">
#exerciseMenu{
height:600px;
overflow:scroll;
}
.scrollImages{
width: 100px;
height: 125px;
margin:10px 5px;
float:left;
background-color:red;
}
.headerWrapper{
display: -webkit-box;
display: -moz-box;
display: box;
-webkit-box-align: center;
-moz-box-align: center;
box-align: center;
width:200px;
height:157px;
}
.exerciseWrapper{
margin-top:5px;
margin-right:5px;
margin-left:5px;
position:relative;
border:5px solid black;
background-color:white;
height:157px;
}
.scrollWrapper {
position:absolute;
border-left:6px solid black;
right:0px;
top:0px;
padding-left:5px;
width:260px;
height:148px;
background:#aaa;
overflow-x:auto;
}
.scroller {
padding:0;
width:1000px;
}
</style>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('body').append('<div id="exerciseMenu"></div>');
for (var i=0;i<8;i++)
{
AppendMenuItems();
}
});
function AppendMenuItems(){
var menuu=$('#exerciseMenu').append('<div class="exerciseWrapper">TEXT<div class="scrollWrapper"><div class="scroller">'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'<div class="scrollImages">Im</div>'+
'</div></div></div></div>');
}
</script>
</head>
<body>
</body>
</html>