如何在HTML5画布动画中改变正方形的矩形

我必须首先说我是一个绝对NOOB，特别是Javascript，所以我需要你的帮助，但请记住，如果你能解释为什么noobs，所以我可能会学到一些东西。如何在HTML5画布动画中改变正方形的矩形

话虽这么说，我正在使用的代码和插件本网站http://cakewp.com/divi-tutorials/add-nice-moving-particles-background-effect/#comment-242上解释到我的网站开发一个客户端（第2图像中，一个在左边粉红色方块）https://soluzionweb.com/lexmart/

而且问题是粉红色的正方形，不是正方形，而是矩形，除非您放大并缩小页面，然后渲染正确尺寸的正方形。

我认为这可能是一个好主意，将我的Wordpress中的particles.js文件加载到页面末尾，因此，加载完整页面后加载，但不知道是否是问题，并不确定这是否会是一个解决方案...以及更多..我尝试了几个函数，但无法弄清楚什么是排队的Javascript文件正确的代码。

这是我actualy：

这是我想什么有：

来源

2017-10-09 Andres Molina Perez-Tome

试试这个插件在一个空白页，让我们知道。如果您可以在空白页面中重现问题，可以为我们创建一个[jsfiddle]（https://jsfiddle.net/）。 – T30

嘿！首先T30，非常感谢您的回答。这就是说，我做了你所问（或至少我认为），并将动画添加到空白页面（我只是在顶部和底部添加了10％的填充），它仍然显示广场上的变形，请参阅这里https://soluzionweb.com/lexmart/particles-test/ 我不知道它是否有助于解决问题，但动画是由一个非商业插件使用这个JS文件https：// soluzionweb创建的。 com/lexmart/wp-content/plugins/ParticleJs-WP-Plugin-master // includes /articles.js？ver = 4.8.2 –

您可以从此链接尝试插件https://github.com/ingeniousweb/ParticleJs -WP-Plugin/archive/master.zip –

此修复程序的问题，把下面的到我的style.css活动主题文件：

.particles-js-canvas-el { 
    width: calc(100 * (1vw + 1vh - 1vmin)) !important; 
    height: calc(50 * (1vw + 1vh - 1vmin)) !important; 
}

根据上面的一些评论，我做了一些测试，发现问题与CSS宽度和高度的声明有关，而不是使用Javascript。

来源

2017-10-09 16:29:21

如何在HTML5画布动画中改变正方形的矩形

回答

相关问题