javascript - 使用 jQuery 不会更改 CSS 属性

Question

我正在制作 NY 卡片并尝试将所有雪花设置在随机位置，但是左侧的雪花位置有效，但顶部没有。

var snowflakes = $("#snowflakes");
var snowflakesCount = snowflakes.data("count");
console.log(snowflakesCount);

for (var i = 0; i < snowflakesCount; i++) {
  var snowflake = $('<div class="snowflake"></div>').appendTo(snowflakes);
  var left = (Math.round(Math.random() * 80)) + "%";
  var top = (Math.round(Math.random() * 40) + 20) + "%";
  snowflake.css("top", top);
  snowflake.css("left", left);
}

body {
  background: #1a0d81;
}
.snowflake {
  position: fixed;
  top: 50px;
  left: 50px;
  background: url("../image/snowflake.png");
  width: 32px;
  height: 33px;
  transition: 5s all linear;
}
#snowflakes {
  position: absolute;
  width: 100%;
  height: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<div id="snowflakes" data-count="10"></div>

snowflake.css("top", top) 不起作用。我得到的只是http://imgur.com/a/RmGCp

Answer 1

https://www.nczonline.net/blog/2007/06/03/javascript-variable-names-you-shouldn-t-use/

你不应该将 top 用作 var