How to make a Stopwatch using HTML CSS and JavaScript

Поділитися
Вставка
  • Опубліковано 26 лис 2024

КОМЕНТАРІ • 141

  • @codetraversal
    @codetraversal  Рік тому +27

    If you like this video, don't forget to subscribe🙂.

    • @zoyaaisha3538
      @zoyaaisha3538 Рік тому +1

      mam i need your help maine ye project bnai but one problem ho rahi stop and reset button sahi se kaam kr rahi but start button me jo js ke last me timerdisplay.innerHTML bnai hu so same wahi aa ja raha or jaise hi stop ya reset krne pe sab 00 ho ja raha

    • @codetraversal
      @codetraversal  Рік тому

      Refer the source code.

    • @zoyaaisha3538
      @zoyaaisha3538 Рік тому

      Mam mera first project hai so mujhe utna samjh ni aa raha

    • @zoyaaisha3538
      @zoyaaisha3538 Рік тому

      Plz koi video share kr dijiye

    • @umaisrasheed2725
      @umaisrasheed2725 Рік тому +1

      @@zoyaaisha3538 app pahla basic karo phr advance pa ana

  • @adityaupadhyay5782
    @adityaupadhyay5782 Рік тому +4

    Bhout accha thaa maja aagya banane mai ......Thank u soo much ...........Ye video dekhne ke badhe hath apne aap hi aagye comment karne..................

  • @adeebkhan8531
    @adeebkhan8531 Рік тому +7

    The best part of these videos is that the teacher explains each and every concept from scratch so even someone who has just started coding can understand with utmost ease. Yet another amazing tutorial. Earlier I made stopwatch project by using a timer variable and setting its value at false (when someone presses start, timer becomes true and stopwatch function runs while it remains false in case of stop and reset). But in this I learned how to make use of the timer id generated by setInterval function and clearInterval. Thanks :)

  • @stockmarketanalysis2895
    @stockmarketanalysis2895 Рік тому +3

    mereko bohot taklif ho rha tha paar apka video dekh ke bohto kuch sikh rha ho , mene 100 video dekhe hea magar apka simplicity samjane ke style best hea please video dalte raho mam pls

  • @NirajKumarPandey1234
    @NirajKumarPandey1234 4 місяці тому +1

    [4].I have seen this lecture today.I have completely understood all the concepts you explained in class. Your teaching method was very simple and effective, which made me understand everything easily. I am very grateful to you for your guidance and hard work. Your student, [Ayush & Adarsh]...🫡❤️
    21TH JULY 2024...

  • @shubhamshrimali3500
    @shubhamshrimali3500 Рік тому +3

    Kyaa samjate ho yaar aap. Aapke pahle wale video se mene calculator banaya. Maja aa gaya.. Thanks👏👏🥰

  • @nirajanolivlogs7647
    @nirajanolivlogs7647 Рік тому +3

    . Best videos ever.Please make others videos and upload fast.. Love from nepal🇳🇵

  • @technicalstatusmuna4594
    @technicalstatusmuna4594 3 місяці тому

    Thank you maam
    Your teaching style is unmeasurable❤❤❤😊😊

  • @SH_ANI043
    @SH_ANI043 4 місяці тому +1

    Superb way of explaining each and everything ❤ Thank you so much

  • @m.dansari7161
    @m.dansari7161 Рік тому +1

    Aapka video mujhe bhut schi tarh samjh ati h

  • @muhamadnaheem5736
    @muhamadnaheem5736 3 місяці тому

    Most advance teacher ❤❤❤❤🎉

  • @umaisrasheed2725
    @umaisrasheed2725 Рік тому +2

    love to learn from this tutorial.

  • @UswaAmjad-mh7tq
    @UswaAmjad-mh7tq 9 місяців тому +1

    Ur teaching method suprb❤

  • @richdairy
    @richdairy Рік тому +6

    Best 💛💛💛👍💯

  • @pakcodecommunity
    @pakcodecommunity Рік тому +1

    very nice effort really loved this video😍😍😍🤩🤩🤩🤩🥰🥰🥰🥰

  • @baazigar5
    @baazigar5 Рік тому +2

    thank you for the tutorial. Your way of teaching is superb 🙌
    and i also wanna say, your voice is so cute! I really like it 😍

    • @codetraversal
      @codetraversal  Рік тому +1

      Thanks

    • @asmashaikh3818
      @asmashaikh3818 6 місяців тому

      Ha Agar koi gent's hota to ye comment na ata (your is so cute ! i really like it )😂

  • @vitthalgadekar1303
    @vitthalgadekar1303 Рік тому

    very nice explanation and introduce yourself

  • @MdNoushad-sb9fr
    @MdNoushad-sb9fr Рік тому +2

    nice mem....we need more and more project about JS

  • @abdullahwafi4451
    @abdullahwafi4451 9 місяців тому

    THANKS for you finally Ifinish

  • @ellis-pr7hh
    @ellis-pr7hh Рік тому +2

    great work keep going

  • @shamima_akter570
    @shamima_akter570 Рік тому

    thank you for this video with brilliant explanation

  • @shamaskhan8383
    @shamaskhan8383 Рік тому +1

    bundle of thanks

  • @jhonsnow534
    @jhonsnow534 Рік тому +3

    Nice content keep it up

  • @naminderdahiya7111
    @naminderdahiya7111 Рік тому +1

    very useful content

  • @vikrantrana5183
    @vikrantrana5183 Рік тому +4

    amazing content

  • @snigdharoy1938
    @snigdharoy1938 Рік тому +3

    Amazing Content 👌

  • @anandhuchandrabose9608
    @anandhuchandrabose9608 Рік тому +2

    very nice

  • @Tech-edu-Trendsetter
    @Tech-edu-Trendsetter Рік тому +3

    Good job 👍

  • @manishkenguva3757
    @manishkenguva3757 7 місяців тому +1

    what are the extension are you using

  • @Pakistan_Tehreek_Insaaf
    @Pakistan_Tehreek_Insaaf 2 місяці тому

    nice explanation

  • @bjsaini3454
    @bjsaini3454 10 місяців тому

    I like this tutorial 🎉🎉🎉

  • @sarthakkumar439
    @sarthakkumar439 Рік тому +2

    Very Nice!!

  • @azharaligondakachehri9419
    @azharaligondakachehri9419 Рік тому

    i love you so much pleach make video for php and python

  • @shubhamsingh-bi7np
    @shubhamsingh-bi7np Рік тому +1

    Hi, mam can you please explain why we have written this if block
    startBtn.addEventListener("click", function () {
    if(timerId !== null){
    clearInterval(timerId)
    }
    timerId = setInterval(startTimer, 10)
    console.log(timerId);
    })

  • @himanshusah1837
    @himanshusah1837 Рік тому +1

    Spr

  • @GarimaShukla-o3m
    @GarimaShukla-o3m Рік тому

    amazingggg video

  • @dewakarchourasia6699
    @dewakarchourasia6699 9 місяців тому +1

    Mam ek Personal Portfolio website ka bhi video banati
    bhut help ho jata mam

  • @happymishra9611
    @happymishra9611 Рік тому +1

    Awesome, portfolio website par bhi banaie

  • @waseemwarraich266
    @waseemwarraich266 10 місяців тому

    Very nice ❤❤

  • @rnscreation8636
    @rnscreation8636 9 місяців тому

    Thank you so much ❤❤❤

  • @RahulSingh-ci3hd
    @RahulSingh-ci3hd Рік тому

    Hello 👋.
    I watched your all video. It's Very Helpful. But I Request you ek is topic par bhi video banao ki jab video dekh ke copy paste karte hai code run karta but jab hum khud Html Css Js ka use karke website banate hai to samjh nhi aata ki konsa javascript ka formula kab aur kaha kis tarika se lagegaa. I'm very confused 😢😐

  • @gopalpatil7170
    @gopalpatil7170 4 місяці тому +1

    13:21 hello ma'am idhar mujhe error aa raha hai kaise fix hoga

  • @meri_jaan7834
    @meri_jaan7834 Рік тому +2

    👌🏻👌🏻👌🏻

  • @happymishra9611
    @happymishra9611 Рік тому +2

    Nest video(project) kab aa rahi hai
    Your project are very useful and easy to understand so i am waiting for your video

  • @awis.835
    @awis.835 4 місяці тому

    Mam react js ka course bii shroo kr dy

  • @kunalsahu8379
    @kunalsahu8379 Рік тому +1

    🔥🔥🔥🔥

  • @umaisrasheed2725
    @umaisrasheed2725 Рік тому

    and your voice😘🤩😍🥰

  • @birajnarayanmoharana2332
    @birajnarayanmoharana2332 3 місяці тому

    Hii, i got an error in the js part, Error in the line
    timerDisplay.innerHTML=`${minString} : ${secString} : ${msecString} `;
    TypeError: Cannot set properties of null (setting 'innerHTML').
    i follwed u as it is. plz help me to fix this.

  • @Jihadvuiya07
    @Jihadvuiya07 Рік тому

    Nais ❤❤ sister

  • @stockmarketanalysis2895
    @stockmarketanalysis2895 Рік тому +1

    mam please suggest me a tips how to do js logical part I am having difficult part on that

    • @codetraversal
      @codetraversal  Рік тому +3

      Just do projects. Start with small projects and learn about events, Event Listeners, DOM Manipulation. Then level up by making projects that use localStorage, APIs. Learn step by step and do a lot of projects

    • @stockmarketanalysis2895
      @stockmarketanalysis2895 Рік тому +1

      @@codetraversal thank you mam

    • @RahulSingh-ci3hd
      @RahulSingh-ci3hd Рік тому +1

      ​@@codetraversalplzz make a video like step by step learning topics of javascript for beginners to advanced

    • @codetraversal
      @codetraversal  Рік тому

      Sure

  • @rayyanahmed814
    @rayyanahmed814 8 місяців тому

    Thanks a lot …

  • @sagarshinde9679
    @sagarshinde9679 Рік тому

    Thank you

  • @Ak47GamerYT
    @Ak47GamerYT 3 місяці тому +1

    My Java Script code is not working 😢 I used the same but it's not.

  • @naginakanwal4273
    @naginakanwal4273 Рік тому

    Mam I have an issue in this task that is my browser not accept the document.queryselector in timer display
    It's the first line of script.js
    How we can resolve it

    • @codetraversal
      @codetraversal  11 місяців тому

      Check the error in the console. Then try to debug.

  • @JuliSinghPatel
    @JuliSinghPatel 3 місяці тому

    Mam js file is not work?

  • @BIZWANET
    @BIZWANET 8 місяців тому

  • @xyeem1566
    @xyeem1566 Рік тому +1

    Once it is reset or stop it doesn't start after pressing start button .

    • @codetraversal
      @codetraversal  Рік тому

      May be you've done any mistake in your code. Refer the source code or you watch the video, i have showed you that after reset your start button is working fine.

  • @mikhaildolgov
    @mikhaildolgov Рік тому

    More ))

  • @akshaymugale8007
    @akshaymugale8007 Рік тому

    How to show output in sidebar

  • @Happiness_World.4U
    @Happiness_World.4U Рік тому

    Mam ye output side me kese show hota h?

  • @ShivamYadav-fm9wf
    @ShivamYadav-fm9wf Рік тому

    How to contact u because i have problem in JavaScript code of stopwatch. Plz salve my problem..

    • @SulaimanAhmadSabiri
      @SulaimanAhmadSabiri 9 місяців тому +1

      let timerDisplay = document.querySelector('.timerDisplay');
      let startBtn = document.getElementById('startBtn');
      let stopBtn = document.getElementById('stopBtn');
      let resetBtn = document.getElementById('ResetBtn');
      let msec = 0;
      let secs = 0;
      let mins = 0;
      let timerId = null;
      startBtn.addEventListener('click', function() {
      if (timerId !== null) {
      clearInterval(timerId);
      }
      timerId = setInterval(startTimer, 10);
      });
      stopBtn.addEventListener('click', function() {
      clearInterval(timerId);
      });
      resetBtn.addEventListener('click', function() {
      clearInterval(timerId);
      msec = 0;
      secs = 0;
      mins = 0;
      timerDisplay.innerHTML = '00 : 00 : 00';
      });
      function startTimer() {
      msec++;
      if (msec == 100) {
      msec = 0;
      secs++;
      if (secs == 60) {
      secs = 0;
      mins++;
      }
      }
      let msecString = msec < 10 ? `0${msec}` : msec;
      let secsString = secs < 10 ? `0${secs}` : secs;
      let minsString = mins < 10 ? `0${mins}` : mins;
      timerDisplay.innerHTML = `${minsString} : ${secsString} : ${msecString}`;
      }

  • @cgssips6047
    @cgssips6047 Рік тому

    Octal literals are not allowed. Use the syntax '0o0' SHOWING THIS CAN yOU
    HELP

    • @adarshy6201
      @adarshy6201 Рік тому

      Any solution for the octal literals?.. Iam facing the same issue. Please help.

    • @yadav24563
      @yadav24563 Рік тому

      Bro you can write 0o00 then work properly

    • @adarshy6201
      @adarshy6201 Рік тому

      @@yadav24563 ok bro tq

    • @SulaimanAhmadSabiri
      @SulaimanAhmadSabiri 9 місяців тому

      @@adarshy6201 you can write just '0' instead if '00' it works correctly

  • @happymishra9611
    @happymishra9611 Рік тому +1

    Github profile viewer using html css JavaScript please 🙏🙏🙏🙏

  • @chinmayasethi4015
    @chinmayasethi4015 3 місяці тому

    Didi let msec = oo; error araha hai dikha raha hai octal literals are not allowed

  • @ganeshvyavahare6236
    @ganeshvyavahare6236 Рік тому

    mam apki java scirp work hi nahi karti hai vs code mai
    html css sab work karti hai

    • @codetraversal
      @codetraversal  Рік тому

      It's working. Check once again and i'll also provide the source code.

  • @ritesh-cu7iy
    @ritesh-cu7iy Рік тому

    Hii
    My 3 key are not working properly please tell me about it

    • @ritesh-cu7iy
      @ritesh-cu7iy Рік тому

      I need to your help

    • @codetraversal
      @codetraversal  Рік тому +1

      Check console if there is any error. Otherwise refer source code.

  • @SKJ315
    @SKJ315 Рік тому

    Hlw mam 😚
    Mene kya hy but Mera stopwatch only start button Kam ho ra hy or kuch nehi ho ra hy😰🥺(sab kuch dekh liya achese fir bhi nehi ho rahy)
    How to contact you ☺️

    • @codetraversal
      @codetraversal  Рік тому

      Watch the video once again and i'll also provide the source code.

    • @SKJ315
      @SKJ315 Рік тому

      @@codetraversal mam bohot bar check Kiya hy acche se likin kaha per galat hy kuch bhi pata nehi chalrahy

    • @codetraversal
      @codetraversal  Рік тому

      I'll provide the source code.

  • @ShivamYadav-fm9wf
    @ShivamYadav-fm9wf Рік тому

    Js use proper check kiya koi error nhi phir bhi start karne pr js ka last code return kr rha h .but reset button kam kr rha h

    • @codetraversal
      @codetraversal  Рік тому

      Use console and check what line if code is not working. Otherwise refer the source code, it's working properly.

    • @ShivamYadav-fm9wf
      @ShivamYadav-fm9wf Рік тому

      @@codetraversal i used consol there is no error i send a preview on insta

  • @techaitoolsbymohit
    @techaitoolsbymohit 9 місяців тому

    mam javascript work nahi kar rahi h 😢

  • @gowthamsundaram7598
    @gowthamsundaram7598 Рік тому +2

    Please add subtitles

  • @AlpanaMathur-x9d
    @AlpanaMathur-x9d Рік тому

    What is the name of the lady?

  • @adarshsinghrajput2730
    @adarshsinghrajput2730 Рік тому

    Stopwatch work nhi kr rhi mri

  • @HasnainCheema374
    @HasnainCheema374 Рік тому

    Software name for programing

  • @softmedun6794
    @softmedun6794 Рік тому +1

    Tum larkiyo ko v dimag thori hoti h n
    Aaj m samjha😂

  • @muhammadawais2696
    @muhammadawais2696 Рік тому

    Your favorite color is black 😅

  • @godwinoyale3550
    @godwinoyale3550 Рік тому

    Use English for the English speaking countries

  • @ashwinikamble6736
    @ashwinikamble6736 Рік тому

    mam java script work nhi kr raha hai maine sourcecode bhe check kiya or vedio bhe 3 bar dekha lekin sab barabar hai😒 .

  • @djfago6240
    @djfago6240 Рік тому

    amazing. please how can i contact you?

  • @Faizan_Iqbal07
    @Faizan_Iqbal07 6 місяців тому