How To Make An Image Gallery With CSS Reflection | HTML, CSS & jQuery Image Gallery
Вставка
- Опубліковано 18 вер 2024
- Learn How to make an Image gallery with HTML, CSS and jQuery, Create 3 Image Gallery with Image Reflection using CSS Reflection
❤️ SUBSCRIBE: goo.gl/tTFmPb
In this video you will learn to make a 3D image slider using HTML, CSS and jQuery. We will add reflection on images using CSS that make this gallery design more beautiful.
jQuery Flipster: github.com/dri...
Download Images: drive.google.c...
-------------------------------------
Recommended Videos:
HTML and CSS For Beginners:
► • Complete HTML & CSS Co...
Make Startup Website using HTML and CSS:
► • How To Make Website Us...
Make Fashion Website Using HTML and CSS:
► • How To Make Website Us...
Mouse move animation using HTML CSS JavaScript:
► • Make Website With Anim...
Make Website with animation using HTML and CSS:
► • How To Make Website Us...
Make Complete Website using HTML and CSS step by step
► • Top 5 Complete Website...
Ecommerce Website Design Using HTML and CSS:
► • How To Make Ecommerce ...
----------------------------------------
Recommended Course
❤️ Complete website Using HTML and CSS
✔️ 8 Complete website step by step
✔️ Source Code Download
✔️ 76 Lectures, 12 Hours Video
✔️ Course Completion certificate
👉 easytutorialsp...
-------------------------------------
Best hosting up to 60% off (coupon- EASYTUTORIALS)
👉 easytutorialsp...
Affordable hosting up to 91% (coupon- EASYTUTORIALS)
👉 easytutorialsp...
My recommended tools and tutorials
👉 easytutorialsp...
-------------------------------------
◼️ Source code link is shared in community post for all my coding videos exclusively for channel members (only channel members can see)
Join Channel Membership:
► / @greatstackdev
-----------------------------------
Image Credit:
pexels.com/
-------------------------------------
Like - Follow & Subscribe us:
◼️ UA-cam: goo.gl/tTFmPb
◼️ Facebook: goo.gl/qv7tEQ
◼️ Twitter: / itsavinashkr
◼️ Instagram: / iamavinashkr
One of the best channels
a tutorial that I understand the most. Thank you
Perfect. So many tutorials get it wrong by not providing fiddles or codepens or just writing away code without showing the intermediary steps. You did it perfectly.
This tutorial is wholesome! I loved it.
Thanku soo much ....for make this type of video ...and your video different to others ..love it .
Thanks Shankar, Glad you like this reflection image gallery design tutorial
Legendary 🔥🔥🔥
What an awesome idea to design a gallery ...love it ❤️❤️
Op sir very helpful for me
I just love your video 🥰
Thank you sujoy
Great!!!! this tutorial made me your new subscriber.
Thanks for the sub!
your videos are amazing. Please add responsive parts to your videos. Keep up the great work
Hello thanks for this tuto , I am now subscribed i just wonder if it's possible to add text on each images and how i could do it Thanks !
Best Tutorial
Thank you, Glad you like this reflection image gallery design tutorial
Thx bro
Very useful tutorial thank you
Best video..❤️🥰🥰🥰
Owesome 🔥🔥🔥
Thank you, Glad you like this reflection image gallery design tutorial
This channel is really underrated
👌🏻👌🏻👏🏻
Thanks Pavan
This is more beautiful and helpful
thanks prince
It's Amaising❤️!!!! Thank You Sooo Much!!!!👍👍
Thank you too!
👏👏👏👏👏👏👏👍👍
Thank you so much
Thanks to you manik, Glad you like this reflection image gallery design tutorial.
sir/mam.
thank you for the videos ,,, but volume a bit louder please!.
Beautiful result worked for me, however can you tell me how to make it responsive for mobiles, thank you.
Hello. Thank you for making such a wonderful tutorial! i am wondering is there a standard version of this for actual web usage because there is a red flag that appears saying 'webkit-box-reflect' is not standard and not compatible for all users to view.
You're the web design boss
over power!!!!
Please portfolio website make!
If you are looking for portfolio section, here it is: ua-cam.com/video/5oHoSy9U1aw/v-deo.html
if you want ti make a personal website, this video will be helpful: ua-cam.com/video/qCFN8EujbGI/v-deo.html
@@GreatStackDev thankuh
there is one error in my jquery flipster idk why i copied the same from github
This code is not working in Visual Studio code.
Make a tutorial of a sign up and sign in, storing passwords in local storage and you can use it to login after creating an account. Javascript
Thanks. How can I display a short description below the images?
bro plz make a vd of packages...
thank you
Thanks Sarika
Is it possible to make it change by itself after few seconds automatically?
How to make it in infinite loop?
What should be the image size
anything in square, I am using 600x600
How will the pic automatically moves. Please make a video on that
Pls can u tell me what application do you use to code
That should be Bracket Editor
he's using bracket editor but i personally prefer using VS code
@@Exille28 real dudes use VSCode 🤝
Hi There. I hope this gets answered XD. If i for example view this gallery in a mobile view then the images cut of, does anyone know what @media tags i should use
May i know how to start the gallery in the first pic since it will started on the middle.
Can you make a music player with progress bar
can we make this sliding automatic ? Plz help
Bro the javascript aint working. I made a error I think. the images are not showing like yours list galary. It's only showing the first image and just a portion of the second image and that is in upside & downside. Please help.
excellent sir but world biggest university 5 number video tutorial
Is this responsive ??
Yes Gowtham
Sir your videos are very special. But plz make vedio on server side language like php JavaScript plz plz plz sir. Ya website vedio using php
Hello sir. Pls just don't understand the * selector at the beginning of the css. Thanks
How would it be done so that reaching the end it returns to the beginning
I have intro video, by using video editor
I wrote the code and everything same but it's not working at all. I think the problem is in the jQuery cdn .
Sir please tell me my program was not coming same output
can you loop the images?
I really enjoy your content honestly. But why still insisting on using jQuery?
Believe I was a massive jQuery user back in the day and I wish they came out with a new version that trumped react,vue etc but they didn't.
Please get with the times. I would love to see your content with vanilla js or a modern framework
the opacity of images didn't change being new to front end i was not abel to understand why can some one help??
add below CSS
.carousel img {
-webkit-box-reflect: below 20px linear-gradient(rgba(255,255,255,0.1),rgba(255,255,255,0.3));
}
sir what is the name of html editor
example
notepad ++
I get a problem "Uncaught TypeError: v.hide(...).css(...).addClass(...).fadeIn is not a function" and the images aren't showing
send me your code on email will check what's the issue [avinashdm@outlook.com]
Hello sir,I have a problem on result.the effect has not come. I think the css command .carousel img is not working to me.can you solve this sir?
Hi you can contact me with your code on email. [avinashdm@outlook.com]
@@GreatStackDev ok sir,thank you.
Anybody know jquery plugin websites for commercial use without pay
if any problems occurs where to show?
How can i do that in React JS?
when I add the github script near the end the images disappear, anyone else having this issue?
Sir. Please tell how to publish zip file in chrome😭😭😭
I feel it would have been better if you had made it by yourself
How to do it without downloading that zip file?
please give the source code. Thank you!
source code ? i am member but i cant see source code ?
Just added it in community post, Please check now
Bhai Hindi main v bana do
thik hai bana denge bhai.
Can you mail me the source code?
Kal se Rate badha dunga me xD
scripts not working 🤬
Yes
Does not work
it works for everyone, I will recommend you to start with beginners video: ua-cam.com/video/GAZVvpjxYQY/v-deo.html
If you build forms for awhile it becomes a little easier. Best of luck!
Copy paste 😂😂😂😩😩😩
Thank you so much
You're most welcome