Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

YouTube

Portfolio Filter Image Gallery Using HTML, CSS, and jQuery - Lightbox Effect

CODE4EDUCATION via YouTube

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!
Learn to create a portfolio filter image gallery with a lightbox effect using HTML, CSS, and jQuery in this comprehensive 50-minute tutorial. Develop a responsive and interactive image gallery that allows users to filter images by category and view them in a lightbox. Master techniques for structuring the HTML, styling with CSS, and implementing dynamic functionality with jQuery. Follow along step-by-step to build the project, including setting up the development environment, creating the gallery structure, applying CSS styles for layout and design, and adding interactivity with jQuery. By the end of the tutorial, you'll have a fully functional, visually appealing portfolio filter image gallery with lightbox capabilities.

Syllabus

Intro
Project Setup
Portfolio Filter Image Gallery HTML Start
Portfolio Filter Image Gallery HTML Preview
Lightbox Plugin Setup
Portfolio Filter Image Gallery CSS Start
Portfolio Filter Image Gallery Container CSS
Portfolio Filter Image Gallery Filter Tabs
Portfolio Filter Image Gallery Navigation
Portfolio Filter Image Gallery Wrappper
Portfolio Filter Image Gallery Content
Portfolio Filter Image Gallery Content Design
Portfolio Filter Image Gallery Responsive Content
Portfolio Filter Image Gallery jQuery Start
Portfolio Filter Image Gallery With Lightbox Design Completed

Taught by

CODE4EDUCATION

Reviews

Start your review of Portfolio Filter Image Gallery Using HTML, CSS, and jQuery - Lightbox Effect

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.