Project
Photo Slider
13 completions
~ 14 hours
4.3 This project is deprecated or unpublished. It may be difficult or impossible to complete it. Please switch to another project.
Learn to display various images to fill your site in a capturing way. Aside from that, learn how to use multiple CSS properties that you can use later on in other projects.
Provided by
JetBrains Academy
About
These days, images occupy a good part of every website. One of the ways we can display them is to use the Photo Slider. The Photo slider allows you to exhibit important work in an eye-catching way. In this project, you will learn how to implement the Photo Slider on your site.
Training project
This project allows you to practice and strengthen your coding skills, helping you get ready for more advanced tasks ahead.
What you'll learn
Once you choose a project, we'll provide you with a study plan that includes all the necessary topics from your course to get it built. Here’s what awaits you:
Add the main title and design a border for the photo slider.
Place the photos in the photo slider section and create the photo slider.
Learn how to fit the picture inside a certain frame. Make a slideshow that displays pictures one by one.
Achieve simple and smooth photo transitions in the slider. Display on the picture without the scroller.
Create a caption with simple instructions that allow simple navigation to the photo slider. Design navigation dots that represent each photo on the slider.
Reviews
1 year ago
I learned how to build a slider. Unfortunately, the navigation points remain non-functional.
Bohyun Lee
1 year ago
"I worked on the project while learning how to move pictures around in a fun way.
2 years ago
I learn about positioning and overflowing content inside the container and how to use background CSS property. it was fun and informative. :)
4.3
Learners who completed this project within the course rated it as follows: