javascript - 如何根据经过的天数更新 css 高度属性

Question

我想更新一个用 CSS 制作的“温度计”，它根据财政年度(截至 6 月 30 日)过去的天数上升。

目前，我通过更新 css 手动更新高度。例如，如果 328/365 天过去了，那么它将设置为 89.86%。

#thermometer .progress {
height:89.86%;
}

如何根据会计年度过去的天数自动更新高度？

Answer 1

您必须使用 javascript/jquery 更新内联高度值:

var now = new Date();
var start = new Date(now.getFullYear(), 0, 0);
var diff = now - start;
var oneDay = 1000 * 60 * 60 * 24;
var day = Math.floor(diff / oneDay);     
var days_as_percentage_of_year = (day / 365) * 100;

$("#thermometer .progress").css('height', days_as_percentage_of_year + '%');