新闻Rotator for Mobile,如Yahoo.com的Iphone和Ipad手机版?

时间:2011-12-26 06:52:31

标签: iphone ipad mobile

建立一个移动网站,并希望创建一个像yahoo.com的移动网站一样工作的旋转器。我可以向左或向右滑动手指,它会刷新闻,我无法使用我的电脑找到它,但在我的iphone上,我猜它会显示出来。

任何信息?谢谢!

2 个答案:

答案 0 :(得分:2)

按部分回答:

  

建立一个移动网站,并希望创建一个可行的旋转器   就像在yahoo.com的移动网站上一样。我可以用手指滑动   向左或向右,它将刷新消息

您可以使用iScroll 4在页面中创建滚动区域。这很简单,我已经实现了。

我不会给你任何代码,而是快速解释:

当你启动iscroll时,你需要给它一个div的id。这个div的第一个孩子是卷轴,所以你必须声明2个div。一个作为包装器(和你将给idcroll的id),以及一个将滚动的内部。在这第二步中,您将添加要滚动的所有内容。

在你的情况下,最好使用UL> LI,然后在iscroll中添加选项snap: li,这样它就不会卡在新闻之间,它会从li跳到li,就像雅虎一样。

  

我用我的电脑找不到它,但在我的iphone上找我   猜猜它会出现。

为此,您需要伪造您的User-Agent,因此Yahoo页面会显示移动版本。使用Firefox,搜索User-Agent Switcher插件(click here if you are lazy)

安装完成后,转到“工具”,您会看到一个带有“默认用户代理”的灰色地球仪。打开它并选择iPhone,例如。

如果你再次使用工具,你会发现灰色地球现在是蓝色的。这意味着您现在将UA假装为iPhone,现在大多数具有移动版本的网页都将更改为移动版。然后,您可以使用Firebug进行检查以了解它们是如何制作的。

但请记住,他们可能只为触摸事件制作了代码,然后当然不能使用鼠标。 (如果他们使用了iScroll,也许他们激活了desktopCompatibility选项,然后如果你用鼠标拖动它就会起作用。)

答案 1 :(得分:1)

您需要进入Safari编程,因为iOS设备使用特定的标识符来识别手势。

只需查看Apple documentation特别是this one的动画和css设计等。