用于移动设备的Javascript图像库

我想为手机制作一个与Flickr功能相似的图像库

我希望它能根据手指移动的方向在触摸屏上移动图像，如果你做了一个小的滑动手势，我希望它能将图像移动到整个方向，或者如果滑动不够大，将div移回其在x轴上的起始位置

我知道逻辑是什么样的，只是不确定使用什么语法

我想应该是这样的：

在touchstart上 -为touchstart的x位置分配变量

接触式移动 -为touchmove的x位置分配变量 -为touchmove减去touchstart指定一个变量 -将（touchmove减去touchstart）添加到div的当前x位置

接触端 -如果touchmove=>touchstart+50px 然后将1000px-（touchmove touchstart）添加到divs x位置

-否则，如果touchmove= 否则 从div的x位置减去（touchmove-touchstart）

---

能有人把这个^ ^翻译成JavaScript吗？

如果你真的能接受挑战，那么有很多事情要考虑。您需要使其独立于平台，决定是使用JavaScript、CSS3动画还是两者兼而有之。它需要具有响应能力，并允许按需加载图像等。向后兼容性如何

您还需要使用一些巧妙的逻辑，不仅要检测touchstart和touchmove之间的距离，还要检测完成此操作的速度。例如，用户可以快速地将手指轻弹一小段距离，导致发生转换，或者可以非常缓慢地将手指长距离移动，导致不发生转换（在限制范围内）

所以要回答您的问题，不，这不仅仅是动画本身。如果没有一些聪明、高效的JavaScript或脚本，它将无法顺利运行

我建议您使用已经存在的众多JQuery库中的一个来完成这项工作。有很多免费的图书馆都很管用。经过快速搜索，我找到了这个：

---

，这似乎正是您想要达到的效果。

如果在触摸移动过程中，div的x位置根据您手指的当前位置进行更改，那么它将以您手指移动的任何速度移动，如果滑动足够大，它将在触摸时向前或向后播放，我可能希望它能以一个固定的速度向前移动，然后放松下来。理想情况下，我不想使用任何类型的库或插件。我只想使用纯javascript，但我会检查Photoswip，看看我是否喜欢它。好的，在看了之后，我有一些关于它的问题。显然，它运行得非常好，并且与所有浏览器等兼容。。。但是我怎样才能改变它的风格呢？另外，是否可以只使用幻灯片部分而不使用缩略图？如果我能完全以这种方式定制它，我会更感兴趣。主要是，我想最大限度地控制它的外观和行为，这就是为什么我更喜欢手工编码的原因，但是如果我可以更改所有内容的css，只使用我想使用的部分，那么我可能会使用它。我只回答了一个问题，可以只使用幻灯片而不使用缩略图。我不能说我曾经使用过Photosweep，我只是在搜索中找到了它作为顶级结果。不过，它看起来可以很好地使用css样式实现，因此您可以根据自己的喜好对其进行自定义。只需修改随附的css文件，您就会一帆风顺。还有其他选项，比如设置一个“目标”，这样它就不会填满整个屏幕，只会填满目标的大小。你需要好好玩玩。希望我至少给你指出了正确的方向。我整晚都在玩它，它有点酷，但试图整理他们所有预先编写的代码来改变简单的事情是非常烦人的。我宁愿自己写。