书架
✨

书架

=一个知识书库=

GSAP动画参照详解
1807 字7 分钟

GSAP动画参照详解

> 以下内容是个整体功能的描述，不会对所有api进行说明讲解，主要是关键性内容描述。 # 前言 作为一个前端开发，不可避免地需要开发动画。如果自己临时写一个动画，还是比较容易出问题的，今天介绍一个很好用的动画库，功能十分强悍 ———— GSAP。 ## 效果 说再多，也不如直接来效果来的直观。 如果能科学上网可以查看以下官网链接： 1. GSAP动画：[greensock.com/showcase/](https%3A%2F%2Fgreensock.com%2Fshowcase%2F) 2. GSAP ScrollTrigger（gsap的插件）动画：[gre
技术设计,前端,threejs
more...
GSAP动画库
1233 字5 分钟

GSAP动画库

> **为什么 选择 GSAP** > > - `GSAP` 是一个老牌框架，但也在持续更新，兼容性很好 > - 与框架无关，比如 `framer-motion`，`react spring` 只能用于 `react`；这里有多个框架的 [starter](https%3A//link.juejin.cn/%3Ftarget%3Dhttps%3A%2F%2Fgsap.com%2Fresources%2Fframeworks) > - 心智负担低，易于上手，它的核心理念就是以时间轴（`Timeline`）为维度的补间动画（`Tween`），在文章后面会聊一下，然后还有各种强大的插件，如
技术设计,前端,threejs
more...
Three.js问题-引入Water无效问题
150 字1 分钟

Three.js问题-引入Water无效问题

## 问题 最近在使用threejs自带的Water方法时，发现如何配置都无法产生水流效果。 <!--more--> threejs版本： ```json "three": "^0.167.0" ``` 配置如下： ```javascript const waterGeometry = new THREE.CircleGeometry(300, 64) const water = new Water(waterGeometry, { textureWidth: 1024, textureHeight: 1024, color: 0x
技术设计,前端,threejs
more...
前端技术栈
196 字1 分钟

前端技术栈

## 技术栈 | **技术栈** | **描述** | **官网** | | ------------ | ------------------------------------------------------ | ------------------------------------------------------------ | | Vue3 | 渐进式
技术设计,前端,技术栈
more...
Three.js之提升渲染效果
1525 字6 分钟

Three.js之提升渲染效果

# `THREE.WebGLRenderer`的参数设置 `THREE.WebGLRenderer`对象的参数设置非常影响渲染效果 要想获得比较好的渲染效果，对`THREE.WebGLRenderer`可进行以下参数设置。 ```javascript var renderer; renderer = new THREE.WebGLRenderer({ antialias:true }); renderer.physicallyCorrectLights = true; renderer.setPixelRatio( window.devicePixel
技术设计,前端,threejs
more...