Page Transitions

Name: Page Transitions
Price: 9 USD
Availability: InStock

4h 10m 33s

English

Paid

October 27, 2023

Integrate the Barba.js Javascript library into your websites and use CSS and Javascript techniques to add smooth and harmonious effects.

Watch Online Page Transitions

#	Title	Duration
1	Welcome to the Page Transitions course	00:48
2	Setting up ourselves for page transitions	06:20
3	What's in our starter kit?	05:04
4	Adding Barba.js to our project	06:59
5	Setting up our HTML for Barba.js	07:01
6	Setting up our Javascript for Barba.js	06:56
7	Setting up Barba's CSS	06:27
8	Adding nicer page transitions to our project	06:00
9	Barba's beforeEnter hook	06:21
10	Correcting our navigation links	14:11
11	Changing the body tag with Barba's views	11:38
12	Adding Barba's 'once' and adding CSS animations	09:21
13	Welcome to Canvas Magazine!	02:54
14	Setting up our project	06:41
15	The IntersectionObserver	17:35
16	Image display using the same IntersectionObserver	06:43
17	Setting up Barba's HTML	06:28
18	Initializing Barba.js	04:08
19	Testing with Barba's CSS module	03:06
20	Making sure our code works between pages	08:15
21	Javascript Promises in hooks	04:33
22	GSAP Timelines	08:38
23	Adding current and next transitions with GSAP	08:55
24	Adding a once transition	04:31
25	Adding a product view and namespace	06:09
26	Adding imagesLoaded to our loading	05:28
27	Welcome to Wanderers	02:22
28	Setting up our project HTML	04:27
29	Setting up Barba	05:25
30	Fading in our navigation	06:07
31	Adding a photos fade and movement	05:06
32	Adding a wiper effect	10:44
33	Adding an image to our interstitial	08:05
34	Adding text transitions	08:45
35	Changing the text with data attributes	06:29
36	Adding in multiple transitions	09:08
37	Barba Prefetch	02:14
38	Thanks for joining our course	00:31