你可以使用 animate.css 库中的 "fadeIn" 和 "fadeOut" 类,这些类会自动为你添加透明度的自然过渡效果。如果你想自己实现这个效果,你可以使用 Tween.js 库中的 Tween.js 方法。
具体来说,你需要这样做:
- 初始化一个 Tween 对象,并指定目标元素和要改变的属性。
var tween =new TWEEN.Tween({ opacity: 0 })
.to({ opacity: 1 }, 1000) // 1 秒内完成转换
.onUpdate(function() {
// 在每一帧更新目标元素的透明度
targetElement.style.opacity = this.opacity;
});