android - 通过 div 元素的 Jquery Mobile 滑动事件

Question

我正在开发一个应用程序phonegap，jquery-mobile它的布局只是两行数据和一个表中大约 50 列。我希望每个水平滑动都显示下一个相应的列，每个垂直滑动显示与每个第一行列连接的相应第二行。

例子：

divA1  divB1  divC1  divD1  divE1  divF1  divG1  divH1  divI1  divJ1
divA2  divB2  divC2  divD2  divE2  divF2  divG2  divH2  divI2  divJ2

每次水平滑动显示一行中的下一个 div，垂直滑动显示其下方的 2div。

我了解如何在不同页面之间滑动作为一种导航形式（使用data-role="page"）但是，

我希望通过一个 div 列表来实现这种类似的功能，但我还没有找到任何解释如何实现这一点的东西。

感谢您提供的任何帮助或可用的插件解决方案来实现这一点。

Answer 1

您应该探索的概念称为sprite sheet。您应该将所有内容放在图层/页面divs上的单个容器中。div然后，您使用动态控制.style的更改，根据滑动的方向div相对于 viewports 重新定位容器。.offset因此，例如，如果个人divs是width:100px每个人，那么左滑动事件应该产生：

var el=document.getElementById("divContainer");
el.style.cssText ='left:'+ (el.offsetLeft-100) + 'px';

向右滑动会增加定位：

(el.offsetLeft+100)

向上/向下将遵循相同的逻辑：

el.style.cssText ='top:'+ (offset top +/- positioning) + 'px';