I want a custom slideshow, please help me in that, I have shared a video

This slide should width should like 80% and next slide should be 20%. when user click on visible next slide it should show the next slide full and like this it continues.

To achieve the desired slide width of 80% for the current slide and 20% for the next slide when clicked, you can use CSS and JavaScript/jQuery. Here’s an example of how you can implement it:

HTML structure:


  

    
  

  
    
  

css

.slider {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.slide {
  position: absolute;
  top: 0;
  width: 100%;
  transition: all 0.5s ease;
}

.current-slide {
  width: 80%;
}

.next-slide {
  width: 20%;
  left: 80%;
}