javascript - 在网络应用程序(如天气应用程序)上模仿 iPhone 滑动 View

标签 javascript iphone css html web-applications

我试图找到一个 Javascript 片段,我可以使用 Javascript 和 CSS3 存档 iOS 的 UIScrollView + UIPageControl 效果。

将页面控件生成到每个 View 的一个点并进行切换非常容易,但复杂的部分是进行 flex 移动。

UIPageControl

我想自己做这件事,但对我来说似乎工作量很大,比如工作数小时,尝试谷歌搜索,但我没有找到任何东西。我不喜欢 JQuery,但移动框架似乎无法做到这一点。

UIScrollView UIPageControl

如果我必须自己做,你们有什么建议的方法吗?我正在考虑使用父 div,每个 View 内部都有一堆 div。使用带有溢出的父级:隐藏; 并将事件附加到父 View 并监听拖动并绑定(bind)到水平滚动偏移。这会是一个好方法吗?还是使用带有 left 或 translate-x 的 css transitions 会更流畅?

编辑: 这是我尝试过的(效果不是很好):JSFIDDLE

最佳答案

是的,

我不确定触摸滑动,但我认为“激活”或“触摸启动”处理程序可能会有用。使用 CSS3 transitions 实现 flex 移动非常流畅,只需更改内部 div 的 left 或 right 样式属性,transfom 就会从当前位置移动到您需要的位置。 这不是世界上最好的例子,但请看这里

villasanrafael.eu/Gallery.php

关于javascript - 在网络应用程序(如天气应用程序)上模仿 iPhone 滑动 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13824750/

相关文章:

html - 如何在页脚小部件的底部添加边框

html - 如何在不使用 anchor 标记隐藏下拉内容的情况下将下拉菜单放置在面板内

javascript - 扩展运算符和 EsLint

javascript - 为什么我的 JQuery 不能在 IE 上加载?

ios - HeaderView 和 FooterView、Xib、StoryBoard

iphone - NSFetchedResultsController 和子 UITableViewController

javascript - 如何获取某些类的子div的父级的多个索引

javascript - 找不到 TypeScript 模块

Iphone SDK,从 UIImage 创建视频

html - 半径在导航栏中不适应