我正在做一些动画，我想在网上实现类似this的内容。我以为HTML画布可以做这种工作。因为我可以缩放图像的一部分。我只需要算法来实际使它工作。
效果是有弹性的，如果窗口很小，恢复时窗口的弹性就越大。我当时认为我可以在网络图像中进行这项工作..如果用户点击图像，它会以这种效果进行缩放，而不是无聊的缩放方式。
这是ubuntu，我知道我们可以查看源代码，看看它实际上是如何实现动画的。但我不知道在哪里找到它。或者我甚至不理解用linux编写的代码，因为我只是理解php，javascript。基本上我不是软件开发人员，我的核心专长是Web开发。
答案 0 :(得分：3)
我相信你最好的选择是看看John Resig的Processing.js。
Processing是Java的动画语言; John已使用canvas将其移植到浏览器中。
答案 1 :(得分：2)
你不会找到一个基于网络的解决方案来为你做这件事。如果您需要这样的东西，它必须在flash或其他应用程序（Lenni提到的Java）中运行在嵌入网页的单独媒体框中。
人们不想要大华丽的动画，如果它变得更有用，那么看到“无聊”的东西要好得多。
答案 2 :(得分：1)
首先 - 我不知道他们在这里使用的实际算法。
然而，我会通过创建一个点网格（例如10x10）来攻击它，每个点通过阻尼弹簧连接到它的邻居。使用弹簧将边缘/角点固定到屏幕上可能是值得的。
通过使网格变形（拉伸和压缩弹簧）然后对弹簧响应进行建模，您将获得一些有趣的效果，如图所示。然后，您可以记录模式，以便如果您的动画是可预测的，则点可以遵循预先计算的路径以获得更快的动画。
然后你需要弄清楚如何分割图像并将其映射到网格上。拆分可能最好在服务器上完成一次，但是如果你使用画布，客户端可以这样做。
svg＆amp; vml是一种可能性 - 它们可以在没有插件的情况下工作，并且类似于代码，但我不认为你会得到足够正确的图像变形。但是，您可以不受惩罚地（并且快速地）进行缩放和旋转，因此如果您只将2个单元格图像点锚定到网格而不是全部4个，您将获得一个有趣的动画 - 不太像视频，但非常好。
至于如何建模阻尼弹簧，你需要跟踪每个点的质量（它有多重），弹簧施加在每个点上的力（压缩/拉伸的标量是多少）并且它是矢量）和点上的阻尼力（对点速度的平方的阻力）。
这是物理建模，可以肯定，但很有可能。
反应可能很慢。特别是在IE上。 Canvas需要IE上的插件，所以如果你使用canvas，IE民众不会看到它。除了IE之外，SVG几乎可以处理所有内容，但它确实具有类似的VML。 http://raphaeljs.com/是一个使用任何可用内容的库。这将是一个挑战调整：）
然而，你这样做，它总是在chrome中看起来最好，V8 javascript引擎在这类工作中超过了其他所有东西。 IE拥有最慢的JavaScript引擎。