How To Make A Sticky Image Columns Section In WordPress With Oxygen
Join Elijah as he creates two different Sticky Image Column sections to display content for your WordPress website with Oxygen.
The first sticky section will contain a simple fade effect as the user scrolls down the page. This effect will be made entirely with Oxygen.
The second sticky section will use custom CSS and JS to perform a transition effect on the image as the user scrolls down the page. We'll use CSS keyframes and a JS Intersect Observer to create this effect.
For the code used in the video, please visit https://gist.github.com/Spellhammer/c....
Get Oxygen ➜ https://oxygenbuilder.com/
Subscribe ➜ https://oxygenbuilder.com/ytsubscribe
JOIN THE OXYGEN FACEBOOK GROUP FOR HELP & SECRET INFO ➜ https://oxygenbuilder.com/facebook
Table of Contents:
0:00 Introduction
1:32 Setting up the Sticky Column
4:40 Adding a Fade Effect
5:58 Setting up the Content Column
9:19 Adding Anchor Animations
12:27 Elevating the Design With a Transition Effect
12:40 Preparing the Sticky Column
13:14 Adding an Observation Class
16:00 Writing the Transition Effect's CSS
17:41 Creating the Javascript
19:25 Adding an Intersect Observer
22:00 Final Thoughts
Смотрите видео How To Make A Sticky Image Columns Section In WordPress With Oxygen онлайн без регистрации, длительностью часов минут секунд в хорошем качестве. Это видео добавил пользователь Oxygen 11 Июнь 2023, не забудьте поделиться им ссылкой с друзьями и знакомыми, на нашем сайте его посмотрели 4,577 раз и оно понравилось 91 людям.