Responsive Owl-carousel Slider using HTML CSS & jQuery

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 พ.ย. 2024

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

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

    Wow That is amazing video, I like it😎😎😎

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

    Genial! Lo que uno necesita cuando quiere hacer un slider! sin nada de relleno. Muchas Gracias!

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

    thanks a lot sir . love from bangladesh

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

    Thank you so much .. you solved my problem

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

    How can i add arrow buttons to move that slider left or right

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

    Thanks bro.you are good.very very thanks brooo

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

      You're welcome bro 💙

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

    at last i found a real and nice video

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

    Thanks Bro, it was helpfull 💚

  • @RaselAhmed-wq8ni
    @RaselAhmed-wq8ni 2 ปีที่แล้ว

    Thank you very much brother, really informative video

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

      Glad it was helpful!

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

    Nice loved it

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

      Thank you 💙😁

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

      Can I show you my channel? I mean if you grant I'll give you my chennal link ,it's ok if you refuse.

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

      You can send me on Instagram - instagram.com/coding.np

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

    Bro listen , i made your responive navbar + carousel and now the carousel is overlapping the navbar when it is turned to mobile view. The order of the scripts and links is correct.
    Please help 🥺🆘

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

    sir when I applying these codes in my website its not applying properly and slider is not working and any css is also not working . It maybe of online link or owl plugins because I downloaded one code also in which i have applied ur online link . Pls help iam working on my website .

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

      It's an online link of owl carousel so you must connected to the Internet.

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

      @@CodingNepal iam connected with internet sir

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

      @@CodingNepal sir I have messaged on insta with footballer_prag Pls check it kindly

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

      @@prag4u896 it wont work correctly if you just stick nepals code into your existing code. Because the sizes and all gets messed up after navbar and content , check the sizes and all . if you wanna see it working create a new window and then you can figure out whats the problem

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

      @@noctis8487 done bro 🥰

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

    amazing Thanks a lot! btw did you create "owl-dots" and "owl-dot" class only with css ?

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

      Actually I use jQuery plugin and in this plugin these class are already created in html file.

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

      @@CodingNepal I am actually not sure about the same thing there. Is the plugin already embedded in the cdn or are there any other resources ?

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

    Thank you so much. Helped me alot.

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

    Ótimo vídeo parabéns 👏.

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

    Great video... Sir plz add voice in video

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

    Awesome bro..

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

      Thank you bro 💙😁

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

    very good

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

    Awesome Work Dude

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

    😲😲😲so awesone

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

    thanks a lot sir .

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

    How can you preview your Html? I tried live server with HTML preview extensions but it only reads my index.html

    • @cantilloc.
      @cantilloc. 3 ปีที่แล้ว

      download live server in vs code

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

      live server is its own module. Alternatively you can look into npm which is what I use as it does a lot of file creating for you :)

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

    Sir kya aap mere is question ka answer dai saktai hai
    Quest yah hai ki
    Mainai section ko ek id diya heading aur is id ko mainai css file mai background image property use kr raha hu to work nhi kr raha hai
    Aur mainai asai likha hai
    #heading{
    background-image: url(images/background.png)
    }Not working sir please batao kyu

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

      Height width bhi do agar nahin hua toh Instagram pe contact karo - instagram.com/coding.np

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

      @@CodingNepal ok sir

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

      Sir abhi tak aapka instagram pr koi reply nhi mila hai

    • @PANKAJ-cr3cb
      @PANKAJ-cr3cb 4 ปีที่แล้ว +1

      Syntax Wrong hai after property " ; " this is missing , otherwise ,
      Url path galt diya hoga😅

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

      @encounter devil Meh abhi insta pe active nahin hu jab honga tab reply dedunga.

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

    Great video! how can i put a model inside cards ?

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

    thanks brother :)

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

    tiene github? no meu não funcionou

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

    Thanks bro

  • @GauravKumar-ue7nz
    @GauravKumar-ue7nz 3 ปีที่แล้ว

    Thanks a lot lot lot

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

    Sir actually I tried to write text in card carousel but between two line there's a huge space and I tried but still there's a huge space can you please help me

  • @PANKAJ-cr3cb
    @PANKAJ-cr3cb 4 ปีที่แล้ว +2

    RIP jQuery 🤣🤣🤣🤣🤣

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

    why does the responsive code doesn't work for me? Could u plz help?

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

      You may did some mistakes... You can get source codes of this tutorial from description link.

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

      CodingNepal I was applying the carousel to the other code u posted. In that you used cards but it was not responsive

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

      Here is the codes.. You can download code files - www.codingnepalweb.com/2020/08/responsive-owl-carousel-slider-using-jquery.html

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

      CodingNepal Also that tutorial u were using flexbox. Does this code not work with flexbox? That would be strange though.

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

      I used owl carousel plugin so it work... Please check your codes and maks sure you're connected to the Internet while running codes.

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

    Thanks

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

      You're welcome 💙😁

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

    hi, como hago para poner 2 carrousel.

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

    10Q U so much

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

    thank

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

      You're welcome 💙😁

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

    nice look
    i love it

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

    Can i find Dots in HTML?

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

    It will be a hard project to do but can you make this carousel without using any library?😅

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

      Okk I'll try to do in upcoming videos 😁

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

      Yes. I need it too

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

      I was about to comment that lmao.

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

      Without library this types of carousel can conflict to other js file so brtter is that use library. This library is vrry light weight i used this many project i like this

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

      @@webdevelopement6887 No they're not light weight a Jquery file is like 86KB and owl-carousel is 46 KB but it may conflict other files.

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

    sir i want to make it with pure javascript...i have tried and made one...but it couldn't make the perfect transition...will you make a tutorial to make this with pure js plz????
    advance thanks

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

      Yes, sure

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

      @@CodingNepal sir,I am still waiting...will you make please???

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

    Cant find that code

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

      Here is the codes - www.codingnepalweb.com/2020/08/responsive-owl-carousel-slider-using-jquery.html

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

    @CodingNepal The code does not work for me, and I followed your exact steps.

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

      Create it on a new empty window and then make changes to your original code it doesnt work if you exactly copy nepals code after your navbar or something

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

    💚💚💚💚

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

    Responsive

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

    Plz speak always hindi or english only

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

    should have done with vanilla js, wasted my time.

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

    ugh what a messy video