jquery - 滚动内部 div 不滚动外部 div？

Question

我为移动设备设置了一个页面，如下所示：http: //jsfiddle.net/Zhm69/1/

我希望能够在'scrollable-div'中向左/向右滚动'outer-wrapper'，但是目前没有任何反应（这很烦人，因为我的每个'inner-divs'基本上都是覆盖的页面整个屏幕，所以我希望能够在页面之间滚动，即使在具有垂直滚动的页面上）

有没有办法我可以做到这一点？可以是 css/jquery/js 解决方案。

这里的代码不能没有一些发布，但请参见小提琴：

outer-wrapper{
float:left;
width:400px;
height:200px;
overflow-x:scroll;
overflow-y:hidden;
}

.inner-wrapper{
width:800px;
height:200px;
}

.inner-div{
float:left;
width:400px;
height:200px;
display:inline-block;
}

.scrollable-content{
width:200px;
height:200px;
overflow-x:hidden;
overflow-y:scroll;
}