如何在不损失可伸缩性的情况下为网页 (HTML/JS) 制作动画？
How to animate a webpage (HTML/JS) without losing scalability?
我试图通过制作一个类似小镇的地图来使我的网页更具交互性，其中包含可点击的不同建筑物并指向我网站上的不同页面，但是我在制作动画时遇到了很多困难只有 HTML/JS 的网页，即使在调整 window.
的大小后也保持不变
为了清楚起见，这是我现在的测试站点：https://people.ucsc.edu/~anlin/test#
（我目前只是在鼠标悬停时在地图的png和建筑物移动的gif之间切换）
我怎样才能做到这一点，我应该使用普通 html/js 以外的东西来做到这一点吗？
谢谢！
可能 svg 会帮助你。你可以用 svg 做一些很棒的互动。同时，您还可以使用css来制作精彩的动画。这真的取决于你需要什么。
看看这个：https://medium.freecodecamp.org/a-guide-to-svg-on-web-c5932dadca03
您可以使用 <svg> ，即 "scalable vector graphic"
这里几乎是您所描述内容的一个精确示例
我试图通过制作一个类似小镇的地图来使我的网页更具交互性，其中包含可点击的不同建筑物并指向我网站上的不同页面，但是我在制作动画时遇到了很多困难只有 HTML/JS 的网页，即使在调整 window.
的大小后也保持不变为了清楚起见，这是我现在的测试站点：https://people.ucsc.edu/~anlin/test# （我目前只是在鼠标悬停时在地图的png和建筑物移动的gif之间切换）
我怎样才能做到这一点，我应该使用普通 html/js 以外的东西来做到这一点吗？
谢谢！
可能 svg 会帮助你。你可以用 svg 做一些很棒的互动。同时，您还可以使用css来制作精彩的动画。这真的取决于你需要什么。
看看这个：https://medium.freecodecamp.org/a-guide-to-svg-on-web-c5932dadca03
您可以使用 <svg> ，即 "scalable vector graphic"
这里几乎是您所描述内容的一个精确示例