所有设备上的CSS / Javascript流畅推送菜单

CSS/Javascript fluent push menus on all devices

本文关键字：Javascript 菜单 CSS      更新时间：2023-09-26

我正在尝试在这里实现类似"左推菜单"的菜单：

http://tympanus.net/Blueprints/SlidePushMenus/

但是，这里的动画并不流畅，不在iPod上，在最近的iPad上也不流畅。我想知道是否有错误实现的东西，或者是否必须使用 javascript 来完成才能创建流畅的动画。

例如，顺利运行的是这样的：

https://medium.com/

不同之处在于第一个链接移动整个文档内容，第二个链接只是移动右侧部分，覆盖左侧部分（但我怀疑它在动画速度上会产生如此大的差异）。我检查了源代码，但无法确定它是通过CSS还是javascript完成的。

使动画流畅的关键是什么？

根据我的经验，iPad/iPod在动画/补间方面似乎并不友好。

我在手机上查看了您的网站，它似乎工作得很好（它是一个机器人）。就个人而言，我不会担心它，我认为这没什么大不了的。但如果它真的困扰着你..

我猜你现在正在使用 css3 过渡？你可以试试javascript，这里有一个很棒的教程：http://www.learningjquery.com/2009/02/slide-elements-in-different-directions

我找到了一个在所有平台上都非常有效的解决方案：

     -webkit-transform: translate3d(0,0,0);

使用 translate3d 移动既流畅又快速。

相关文章：