Digital Clock with Colorful Glowing Effect using HTML CSS & JavaScript

Подписаться 226 тыс.

Просмотров 80 тыс.

50% 1

Digital Clock with Colorful Glowing Effect using HTML CSS & JavaScript
Download Codes From Here - www.codingnepalweb.com
Second Channel - bit.ly/3aHNkru
My Code Editor - • Best Text Editor for H...
Facebook - / coding.np
Instagram - / coding.np
Music Credit:
Track: BEAUZ & JVNA - Crazy [NCS Release]
Music provided by NoCopyrightSounds.
➤ Watch: • BEAUZ & JVNA - Crazy |...
Track: Lost Sky - Dreams pt. II (feat. Sara Skinner) [NCS Release]
Music provided by NoCopyrightSounds.
➤ Watch: • Lost Sky - Dreams pt. ...

Опубликовано:

27 авг 2020

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 123

@kumakuma3926 3 года назад

This was so easy to follow along with. Thanks!

@zuberdiwan8123 Год назад

Awesome...Really Great Work...Thank You.......

@Kun.89 Год назад

Hola, no entiendo ingles pero me encanta que solo uses musica, muy buenos tutoriales, nuevo subscriptor.. Saludos desde Mexico, City 💥💥💥💥❤

@koustubhsatalkar9215 2 года назад

Yeah love from India bro🤟

@adithyaprasetio4809 4 месяца назад

Very simple and helpful, thanks sir

@royalzgamerz2378 2 года назад

Clock is amazing 😀

@repalda4736 2 года назад

your awesome😍😍👌

@okeequiz Год назад

this is too good love you

@minbahadur9000 2 года назад

Nice 👍

@rajnishkumar1791 Год назад

Thanks ❤️

@ayouber779 3 года назад

Woooow👍👍👍👍

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@panjatanhaq Год назад

you are great

@Hasnain_Mahmood Год назад

Nice bro

@HieuPhan-jt8bj 3 года назад

thanks you !!

@CodingNepal 3 года назад

You're welcome.. Stay tuned 😁

@mdhossen7082 2 года назад

Wow

@TechWithAashubro 3 года назад

Keep it up

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@AmanRaj-sk5ws 3 года назад

I am waiting for your tutorial ❤️❤️

@CodingNepal 3 года назад

Okk.. Stay tuned 😁

@CreativeTutorialsWeb 3 года назад

Awesome

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@gb-wo9gs 3 года назад

1 No chote 👌

@CodingNepal 3 года назад

Thank you.. Stay tuned.

@stefansiroo9078 2 года назад

please explain how i can set the time of las vegas in this clock.

@mustafachenine7942 Год назад

thanks

@Bindashmusic 3 года назад

Nice clock

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@coooooool382 3 года назад

Ikr😅❤️

@markwest5904 Год назад

Nice Intro

@RahulKumar-bk1ss 3 года назад

best sir

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@youtubehelper227 3 года назад

Op dai

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@Miguel-sm4tc Год назад

hola que tal queria consultar porque al colocar esto: -webkit-background-clip: text; css me lo destaca pero en la consola no me da error y no entiendo porque css lo marca.

@Ryzenpath 11 месяцев назад

same

@rahulrbhat3114 3 года назад

I like the border colorfull

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@dakshkeshari6448 3 года назад

u are master of coding love videos and plz tell how to creat keybord

@CodingNepal 3 года назад

Thank you and check out these two videos: - ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-WlsY02Uka1Y.html - ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-fsBJXiP--Jc.html

@dakshkeshari6448 3 года назад

@@CodingNepal Thank u Sir!

@deepshikhagupta526 3 года назад

Hi I am ur new subscriber :)

@CodingNepal 3 года назад

Thanks for sub 😃

@subarnadey3167 3 года назад

Can I use vs code for this

@jaystockton2096 3 года назад

How can I change the time to Japan and Europe time zone? Great Videos...please keep it up.

@CodingNepal 3 года назад

You can do this with specify time zone.

@samarjyoti3184 2 года назад

@@CodingNepal how can I specify time zone

@mohsinsayyad6347 3 года назад

👌

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@mohammodfatinnur1140 3 года назад

Good job

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@mohammodfatinnur1140 3 года назад

@@CodingNepal your 2nd channel is best (couse I love detailed information). Btw how you can say hindi 🤔🤔

@CodingNepal 3 года назад

Are you from India?

@mohammodfatinnur1140 3 года назад

@@CodingNepal Bangladesh 🇧🇩

@CodingNepal 3 года назад

Oh great..stay tuned with us 😁

@AmanRaj-sk5ws 3 года назад

bro please make one video how to add preloader by code not by gif please.

@CodingNepal 3 года назад

Here is the video - ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-lczgnhMphdU.html

@xviewmytubex 2 года назад

How did you autofill/complete the HTML? Thanks! =).

@jebsanimation1376 Год назад

type "!" then press enter welcome ;)

@blackops4452 3 года назад

Sir I have completed this very Issy

@CodingNepal 3 года назад

Great

@nasirmedia Год назад

Where past the html code?

@erenxbaxci 3 года назад

How did you make your blog.

@CodingNepal 3 года назад

How i tell you in the comment..? So contact me on Instagram.

@naateshwar__ 3 года назад

You Expect More Subscribers Likes And Views

@CodingNepal 3 года назад

Thank you.. Stay tuned 😁

@jhonnynaiduattitudefreak9160 2 года назад

It says document is not defined sir

@firstbloodfangy6933 Год назад

Wierd I tried choosing my own colors for the gradients of the clock but it just turned into the same rainbow technicolor jazz.... I have no idea why that is.

@KalyaniTalks 3 года назад

I got an error : date.getHours is not a constructor

@CodingNepal 3 года назад

You may missed some lines of codes or did any others mistake... Please get source codes from description link.

@crisselbajelot2122 2 года назад

Your clock is very nice I love it, but mine is not working 😔

@CodingNepal 2 года назад

You can get source codes from here - www.codingnepalweb.com/digital-clock-using-javascript/

@keynbrosdahl2925 8 месяцев назад

Can you do this again, but show you opening up VSCode and creating each file needed. It needs to all start blank. Don't assume that my dumbass knows the simplest shit. I'm teaching myself

@simonk5283 3 года назад

The timer is in the right corner how can I make it come in the center

@CodingNepal 3 года назад

I already placed it at the center. You may did some mistakes. Just add these codes body{display: flex; align-items: center; justify-content: center; min-height: 100vh;}

@simple8810 3 года назад

what if we dont mention time for timeInterval function?

@CodingNepal 3 года назад

I also didn't mention time for setInterval in this video so the inside codes is running after every 0ms. If you set time for setInterval 1ms or more then the inside codes will run after every time that you've mentioned. But don't set more than 0ms time because it'll delay to running inside codes so the time of this clock will not update exactly according to your pc time.

@simple8810 3 года назад

@@CodingNepal Thanku Boss for your reply,Yeah I was asking about that setInterval,As mostly we metion time means some delay,But here when I saw you have not mentioned, I did search on google for that why it so,but then I just assmumed from myself that maybe due to that we will not have any delay for this clock, ANd you explained it very well and thanks for removing my doubt about this, we want many videos like this on js , please sir huge request cause we want to improve skills learning from you

@mdamanullahkhan3412 Год назад

4:29

@diyorbekmaxkamov2818 2 года назад

Eee Tinchmi

@Nope-rd8rn Год назад

How I convert this into app bro

@GR_BackingTracks Год назад

5:54 we get to the Scripting... that's where I need to be.

@legacy2559 2 года назад

How can I access the codes you wrote?

@CodingNepal 2 года назад

Yes, here is the codes - www.codingnepalweb.com/digital-clock-using-javascript/

@ahmadkai10293 2 года назад

Can you do a tutorial to add a date as well?

@CodingNepal 2 года назад

Sure, stay tuned

@SanjayKumar-kn6rc 3 года назад

Code ko paste Kar dunga website pe to ho jayaga kya

@CodingNepal 3 года назад

Haan hojayega

@Govindkumar-ox5kj 11 месяцев назад

what is -webkit-background-clip

@crazyrebel4767 3 года назад

Can we add this clock at our screen?

@CodingNepal 3 года назад

Yes you can.

@crazyrebel4767 3 года назад

@@CodingNepal how sir can you tell me I have made it

@faizanbutt2761 3 года назад

setInterval(() => { const time = Document.queryseletor("#time") let date = new Date(); let houre = date.getHours(); let minutes = data.getminutes(); let seconds = data.getseconds(); time.textcontent = houre + ":" + minutes + ":" + seconds; }); sir this part cantnot work plz tell the mistake

@Itzyasir2 2 года назад

you have a lot of typos...

@sabbirbhuiyan470 3 года назад

Bro, I can't find the code of this video on your website. Can I get them???

@CodingNepal 3 года назад

I'll upload tomorrow.. Keep patience.

@sabbirbhuiyan470 3 года назад

@@CodingNepal I'm will be there, thanks

@CodingNepal 3 года назад

Check now - www.codingnepalweb.com... Codes are uploaded.

@greenstep2706 2 года назад

@hagozox 2 года назад

Pake hp bisa?

@codingbd9201 3 года назад

Which country do you live in bro. You are a fantastic web developer

@CodingNepal 3 года назад

Nepal bro

@snehaohol3196 2 года назад

Sir code file is not downloading what I do

@CodingNepal 2 года назад

Make sure you've disabled your adblocker on my website or open that page on incognito window and try to download codes.

@k.i.n.g5046 2 года назад

❤❤❤❤❤❤❤❤❤❤ ❤❤❤❤❤❤❤❤❤❤

@Ashu.tosh_shukla Месяц назад

Your editor name

@CodingNepal Месяц назад

It's Atom

@Milestris1 2 года назад

i want no glowing

@apdiapaal3287 3 года назад

I get error is not showing shadow moving in the background 🙁

@CodingNepal 3 года назад

Please check your css codes again.

@kanynfanpage724 3 года назад

@@CodingNepalwhen i did place-items center it just put it at the top of the page

@sohamvermavi-a971 3 года назад

my code is not working

@030parthibanm8 2 года назад

If you don't mind , give that code😀

@CodingNepal 2 года назад

You can download it from here for free - www.codingnepalweb.com/digital-clock-using-javascript/

@mr_weirdo Год назад

bro this is not good, you are providing link to your website and saying this is link for code.

@statusbeast3866 3 года назад

Dai yo blogger ma use grna milxa??

@CodingNepal 3 года назад

Milxw bro

@statusbeast3866 3 года назад

@@CodingNepal malai yeauta movie detail box chaiyo ramro khaley tutorial banai dinu hunxa?

@chhappri1648 Год назад

Ka dekhi ho bro

@sergeyinozemcev1070 Год назад

My little js upgrade: let meridiem = hours > 12 ? "PM" : "AM" hours = `0${hours}`.slice(-2) minutes = `0${minutes}`.slice(-2) seconds = `0${seconds}`.slice(-2) time.textContent = `${hours}:${minutes}:${seconds} ${meridiem}`