GSAP 다운로드 GSAP 소스 코드 다운로드

GSAP

기타 소스코드

1.0.0

다운로드

GSAP (Greensock 애니메이션 플랫폼)

GSAP는 개발자를 애니메이션 슈퍼 히어로로 전환하는 프레임 워크 공유 자바 스크립트 애니메이션 라이브러리입니다. 모든 주요 브라우저에서 작동하는 고성능 애니메이션을 구축하십시오. 애니메이션 CSS, SVG, 캔버스, 반응, vue, webgl, 색상, 문자열, 모션 경로, 일반 객체 ... JavaScript가 만질 수있는 모든 것! GSAP의 ScrollTrigger 플러그인은 최소한의 코드로 턱을 끄는 스크롤 기반 애니메이션을 전달합니다. gsap.matchmedia ()는 반응적이고 접근성 친화적 인 애니메이션을 산들 바람으로 만듭니다.

1,200 만 개가 넘는 사이트에서 실제 문제를 해결하면서 이러한 고급 시퀀싱, 신뢰성 및 엄격한 제어를 제공하는 다른 도서관은 없습니다. GSAP는 수많은 브라우저 불일치를 중심으로 작동합니다. 당신의 애니메이션은 그냥 작동합니다 . 핵심적으로 GSAP는 고속 속성 조작기로서 시간이 지남에 따라 극심한 정확성으로 값을 업데이트합니다. jQuery보다 최대 20 배 빠릅니다!

GSAP는 완전히 유연합니다. 원하는 곳에 뿌립니다. 제로 의존성.

스크롤, 모핑, 모션 경로를 따라 애니메이션 또는 플립 애니메이션과 같은 고급 효과를 쉽게 달성하기위한 많은 옵션 플러그인 및 완화 기능이 있습니다. 브라우저/장치에서 이벤트 감지를 정상화하기위한 편리한 관찰자도 있습니다.

시작하세요

문서 및 설치

설치 안내서를 포함한 전체 문서를보십시오.

cdn

 < script src =" https://cdn.jsdelivr.net/npm/[email protected]/dist/gsap.min.js " > </ script >

핵심 파일/플러그인에 대한 빠른 CDN 링크는 JSDELIVR의 전용 GSAP 페이지를 참조하십시오. gsap.com에는 더 많은 설치 지침이 있습니다.

모든 주요 광고 네트워크는 파일 크기 계산에서 GSAP를 제외하고 대부분 자체 CDN에이를 가지고 있으므로 적절한 URL을 요청하십시오.

NPM

NPM을 통해 GSAP 사용에 대한 안내서는 여기를 참조하십시오.

 npm install gsap

GSAP의 핵심은 CSS 및 속성을 포함한 거의 모든 것을 애니메이션 할 수 있으며 Interpolate (), MapRange (), 대부분의 완화와 같은 모든 유틸리티 방법이 포함되어 있으며 스냅 및 수정자를 수행 할 수 있습니다.

 // typical import
import gsap from "gsap" ;

// get other plugins:
import ScrollTrigger from "gsap/ScrollTrigger" ;
import Flip from "gsap/Flip" ;
import Draggable from "gsap/Draggable" ;

// or all tools are exported from the "all" file (excluding members-only plugins):
import { gsap , ScrollTrigger , Draggable , MotionPathPlugin } from "gsap/all" ;

// don't forget to register plugins
gsap . registerPlugin ( ScrollTrigger , Draggable , Flip , MotionPathPlugin ) ;

NPM 파일은 ES 모듈이지만 추가 호환성을위한 UMD 파일이있는 / dist / 디렉토리도 있습니다.

GSAP.com 계정에서 클럽 GSAP 회원 전용 플러그인을 다운로드 한 다음 자신의 JS 페이로드에 포함시킵니다. NPM/YARN으로 설치할 수있는 Tarball 파일도 있습니다. GSAP에는 회원을위한 개인 NPM 레지스트리도 있습니다. 포럼에 질문을 게시하면 기꺼이 도와 드리겠습니다.

Scrolltrigger & ScrollSmoother

스크롤 구동 애니메이션을 찾고 있다면 GSAP의 ScrollTrigger 플러그인이 새로운 표준입니다. 동반자 스크롤 스모너도 있습니다.

React 사용?

useEffect() / useLayoutEffect() 의 드롭 인 대체품 인 useGSAP() 후크를 노출시키는 @gsap / react 패키지가있어 정리 작업을 자동화합니다. 자세한 내용은 React Guide를 읽으십시오.

자원

gsap.com
시작 가이드
문서
데모 및 스타터 템플릿
커뮤니티 포럼
시각화를 편안하게하십시오
유리 진열장
YouTube 채널
치트 시트
보너스 플러그인을 무료로 사용해보십시오
클럽 GSAP (이 저장소에없는 무제한 보너스 플러그인에 액세스)

클럽 GSAP 란 무엇입니까?

Club GSAP에 가입 한 3 가지 주요 이유는 다음과 같습니다.

MorphSVG, SplitText, ScrollSmoother 등과 같은 Snazzy 회원 전용 플러그인에 액세스하려면
특별한 상업 라이센스를 얻으려면.
지속적인 개발 노력을 지원하고 우리를 응원합니다 .

자세히 알아보십시오.

모든 보너스 플러그인을 무료로 사용해보십시오!

https://gsap.com/trial

도움이 필요하십니까?

친절한 GSAP 포럼에서 물어보십시오. 또는 지식을 공유하고 다른 사람을 도와주십시오. 기술을 연마하는 좋은 방법입니다! 버그도보고하십시오 (또는 원하는 경우 여기에 문제를 제기하십시오).

특허

Greensock의 표준 "No Charge"라이센스는 https://gsap.com/standard-license에서 볼 수 있습니다. 클럽 GSAP 회원에게는 추가 권한이 부여됩니다. 자세한 내용은 https://gsap.com/licensing/를 참조하십시오. GSAP가 MIT (또는 유사한) 오픈 소스 라이센스를 사용하지 않는 이유는 무엇 입니까 ? 이 기사는 모든 것을 설명합니다 : https://gsap.com/why-licence/

확장하다

추가 정보