How To Create An Image Comparison Slider Using HTML, CSS and JavaScript

Hi guys, in this video, I will show you how to design an image comparison slider using HTML, CSS and JavaScript. I hope you find this useful.

------------------------------------------------------------------------

[RiponRRahman]

Hey, I am trying to add this slider in my existing website. everything is fine but slide does not work. whats the problem? I did copy paste your code and changes the path. still not working! can you please tell me whats the problem?

[georgek]

Followed through your tutorial. Works fantastic. Clearly explained and easy to follow. I was easily able to add my own before and after photos to it.
Would you happen to have another on how to make something like this go to full screen? I would really like to be able to make my comparison larger to see details better. Ideally you could/would continue on with this example to show how to add a "Full Screen" button and then to close it. (Like ESC key.)

[bennysumaryono]

At 6:50. My result is quite different. The after image (black and white) lies above the before image. I think it causes "the before" image to not show in the result after finishing all the steps, so the slider only shows a black and white image even when I move the slider right-left. Can you help me with that? Where should I check the code?

[santoshrupnar]

Hello bro how to create our own ads webside please tell this