Latest Javascript Image Slider with Next and Prev buttons | Html, Css and Javascript Image slider

แชร์
ฝัง
  • เผยแพร่เมื่อ 6 ก.พ. 2025
  • Code :- github.com/skc...
    In this video you will learn how to make a image slider using html, css and javascript with next and prev control buttons.
    This is an awesome and easy image slider with source code.
    Twitter:- / webzonecode
    TH-cam:- / webzonecode
    Github:- github.com/skcals
    Codepen:- codepen.io/skcals

ความคิดเห็น • 41

  • @Novaanimz_shorts
    @Novaanimz_shorts ปีที่แล้ว +1

    You know the pain when it doesn't work but it worked for me
    You've got to be careful in JavaScript if not you'll be frustrated
    Thanks this was so helpful

  • @marcioaugusto392
    @marcioaugusto392 3 ปีที่แล้ว +12

    Your code is simple, functional and very helpful. That's exactly what I was looking for. Thank you!

  • @zigaudrey
    @zigaudrey 3 ปีที่แล้ว +1

    I know nothing about Javascript but this is a great base for programming image changer.
    Now, time for effects.

  • @elsantiago5804
    @elsantiago5804 ปีที่แล้ว +1

    So fast and clear, flawless work!
    Thank you dude!

  • @DirtMankee
    @DirtMankee 2 ปีที่แล้ว +2

    Thank you man. I was trying to do exactly like this but I got stuck on the if() part. I downloaded your code and analyzed it a bit and then understood it.

  • @yuriyzadorozhnyi3849
    @yuriyzadorozhnyi3849 7 หลายเดือนก่อน

    Дякую Вам друже це було круто!

  • @auroth6805
    @auroth6805 2 ปีที่แล้ว

    Took me a while to get the video I needed for this project ^-^

  • @nem9187
    @nem9187 11 หลายเดือนก่อน

    really easy to implement into code!
    Thank you so much

  • @tegalucky383
    @tegalucky383 2 ปีที่แล้ว

    so simple, so easy to understand.....good one

  • @luizricardo6534
    @luizricardo6534 3 ปีที่แล้ว +1

    Just the way i needed, thanks so much o/

  • @phyrom6438
    @phyrom6438 2 ปีที่แล้ว

    Nice easy to understand thanku

  • @M.RIYAS.GHOST.OF.SPARTA
    @M.RIYAS.GHOST.OF.SPARTA 2 ปีที่แล้ว +1

    Thanks 👍🏻

  • @adamsaime-desire7240
    @adamsaime-desire7240 4 ปีที่แล้ว

    Good job guy, your video has been very helpful for me, thank you !!! :)

  • @kashifkhi
    @kashifkhi 3 หลายเดือนก่อน

    all function is work but one image select for zoom how is we can do it

  • @parvezkalia4648
    @parvezkalia4648 3 ปีที่แล้ว

    what a tutorial.. thanks for this tutorial

  • @Kyogoyt
    @Kyogoyt 2 ปีที่แล้ว +1

    Hi, your code is super cool, but i need one extra thing. I need the text 1 of 5. When im going to the 2nd image then it shows me 2 of 5. You know what i mean? Do you know how i can do this?

  • @satyamkatiyar7714
    @satyamkatiyar7714 4 ปีที่แล้ว

    than u very much for this amazing video

  • @5minutesfoodtips528
    @5minutesfoodtips528 3 ปีที่แล้ว

    Good bro

  • @pratapbairagi7824
    @pratapbairagi7824 3 ปีที่แล้ว +1

    Return function is not working! I have cross checked many time, didn't get any fault in code. Any solution for this?

  • @jakabsislol8169
    @jakabsislol8169 2 ปีที่แล้ว

    hello why when i tried the programm i had the button "prev" was above the button "next" pls i need help on this as quickly as possible plssss

  • @nyamcat8334
    @nyamcat8334 2 ปีที่แล้ว

    Thank you!

  • @סטסאנטיפוב-ק9ב
    @סטסאנטיפוב-ק9ב 3 ปีที่แล้ว

    ot works with maps too????

  • @admed6013
    @admed6013 ปีที่แล้ว

    Thank you

  • @devabdee
    @devabdee 2 ปีที่แล้ว

    great

  • @edilfonsocajun4837
    @edilfonsocajun4837 4 ปีที่แล้ว

    @Web Zone How can I use this code to insert another slideshow in the same page (one beside the other); having the previous and next buttons controlling its respective slideshow.

  • @petrkorecky4322
    @petrkorecky4322 3 ปีที่แล้ว

    Thanks a lot :)

  • @sony3246
    @sony3246 4 ปีที่แล้ว

    How do you create this same code with multiple sliders on one page?

  • @arditbytyi346
    @arditbytyi346 4 ปีที่แล้ว

    Thanks alot! :)

  • @riturajjha
    @riturajjha 3 ปีที่แล้ว

    How to animate clips

  • @nages1549
    @nages1549 3 ปีที่แล้ว

    Tq super

  • @hstecnologia
    @hstecnologia ปีที่แล้ว

    cara muito bom

  • @robertoblanco192
    @robertoblanco192 2 ปีที่แล้ว

    Hi, can someone explain me next code? if(i

    • @MBHL-ug7ln
      @MBHL-ug7ln ปีที่แล้ว

      "...i represents the current index of the image being displayed in the slider.
      i

  • @AdityaSharma-gh3jr
    @AdityaSharma-gh3jr 3 ปีที่แล้ว

    While sliding to next one of my image goes hide
    Cant find any errors
    Loop is working fine

    • @goat5545
      @goat5545 ปีที่แล้ว

      currently having the same, after the last image in the array it hides. Did you manage to fix it?

  • @ashmusic621
    @ashmusic621 4 ปีที่แล้ว

    Can someone explain to me what's going on in the loop? I'm beginner & I'm unable to understand what is going on?

    • @sabihahsalleh3951
      @sabihahsalleh3951 4 ปีที่แล้ว +4

      Im new to javascript, but i guess the loop is similar to other programming language like c++ etc. 'If' statement is when you want to execute next code if the condition is true.
      'i' was declared as a variable with initial value 0. In function prev(), if the value of 'i' is equal or smaller than 0 (condition), then value of 'i' will be equal to image.length (the value is equal to the last picture), after that decrement the value 'i' by one for every loops and return the value function setimg(). The same concept for function next() too. Sorry if im mistaken and for my bad english.

    • @ashmusic621
      @ashmusic621 4 ปีที่แล้ว

      @@sabihahsalleh3951 Thank you!

  • @nomyr
    @nomyr 3 ปีที่แล้ว +1

    what a waste of time

  • @chriskramer9311
    @chriskramer9311 3 ปีที่แล้ว

    scrubbing scrubbing...oh, inline js function, buh bye!