使用 jQTouch javascript iphone / ipad 进行简单的滑动图库

发布于 2024-09-15 20:32:03 字数 436 浏览 3 评论 0原文

我希望实现的是拥有一个简单的图像库，用户可以使用 jQTouch 进行滑动浏览（ http://jqtouch.com )

<div id="container">
<img src="1.gif">
<img src="2.gif">
<img src="3.gif">
</div>

图片相当长，例如每张宽度为 200px。容器本身宽 300 像素，具有隐藏的溢出。

我希望发生的是，当用户滑动厨房容器时，它将图像向左/右拖动。

到目前为止，我已经设置了容器来接收滑动事件及其方向，但是说实话，我完全不知道从哪里开始。

任何建议表示赞赏。

原文

What I wish to achieve is have a simple gallery of images which the user can swipe through using jQTouch ( http://jqtouch.com )

<div id="container">
<img src="1.gif">
<img src="2.gif">
<img src="3.gif">
</div>

The images are quite long, for example 200px in width each. The container itself is 300px wide with hidden overflow.

What I wish to happen is when the user swipes the galley container, it drags the images to the left/right.

So far I have set up the container to receive swipe events and which direction it is in, however to be honest I have completely no idea where to go on from there.

Any advice appreciated.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

马蹄踏│碎落叶 2024-09-22 20:32:03

您遇到过这个演示吗？

“照片库”和“照片库2”可能就是您想要的。如果您只想拥有照片和一些标题，那么设置应该相当简单：

jQT.generateGallery("pageID",
    [
    {src:"http://www.site.com/somepic.jpg"},
    {src:"pic1.jpg",caption:"Test Image 1"}
    ],
    {defaultIndex:1}
);

您需要 jQT 照片扩展名：jqt.photo.js 和 jqt.photo。 css.

Have you come across this demo?

"Photo Gallery" and "Photo Gallery 2" may be what you want. And if you just want to have photos and some captions, it should be fairly simple to setup:

jQT.generateGallery("pageID",
    [
    {src:"http://www.site.com/somepic.jpg"},
    {src:"pic1.jpg",caption:"Test Image 1"}
    ],
    {defaultIndex:1}
);

You'll need the the jQT photo extension: jqt.photo.js and jqt.photo.css.

回复收藏 0 原文