在页面之间共享 Webkit 转换数据答案

【问题标题】：Sharing Webkit Transform Data Between Pages在页面之间共享 Webkit 转换数据
【发布时间】：2012-05-19 16:58:43
【问题描述】：

我的元素旋转很慢，使用：

@-webkit-keyframes rotate {
    0% {-webkit-transform: rotate(-10deg);}
    100% {-webkit-transform: rotate(10deg);}
}

...和：

-webkit-animation: rotate 10s infinite alternate ease-in-out;

...在每个元素上应用旋转。

问题是在更改页面时，旋转将从头开始在每个元素上开始，理想情况下，我希望它将每个元素的初始值设置为在继续旋转之前离开上一页时的值。

我正在考虑通过 Javascript 执行此操作，但我不确定这样的事情是否可能。检索旋转值似乎不是问题，但将其传递到下一页确实...

【问题讨论】：

【解决方案1】：

您可能想查看 html5 历史 api 并简单地使用 xmlhttprequest 请求新页面并在操作 url 时更新您的 dom。

想到的一件事是：您可以读取转换矩阵并将其保存在本地存储中并重新应用它...

【讨论】：

不错的答案...如果 localstorage 出于兼容性原因而退出，您可以将其粘贴在 cookie 中，或者我最近最喜欢的 window.name。
感谢您的回答。我已经尝试使用会话存储并基于此应用旋转值，除非与关键帧动画结合使用 - 它会覆盖它。我认为更好的方法是让导航面板（旋转元素所在的位置）与网站的其他部分保持静态......就像 facebook 导航菜单。