How to make Calculator With JavaScript | CSS Glassmorphism Effects | Glass morphism

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

КОМЕНТАРІ • 138

  • @TheCodingOdyssey
    @TheCodingOdyssey 3 роки тому +64

    This looks sick! One can become a css master just by watching and coding along on this channel!

    • @Saidur07
      @Saidur07 3 роки тому +5

      By copying? 😁

    • @TheCodingOdyssey
      @TheCodingOdyssey 3 роки тому +6

      @@Saidur07 thats not what I mean. If you copy what he is doing and trying to understand it, then you will understand and master css

    • @Saidur07
      @Saidur07 3 роки тому +2

      @@TheCodingOdyssey That's what I am doing 😁

    • @Saidur07
      @Saidur07 3 роки тому +1

      But,we shouldn't kill our creativity

    • @TheCodingOdyssey
      @TheCodingOdyssey 3 роки тому +8

      @@Saidur07 More knowdlege does not kill creativity, it fuels it. I am not saying that the only thing you should do is code along with this channel. Practice on your own as well, creating new things with the tools you learn.

  • @krishnachoubey8648
    @krishnachoubey8648 3 роки тому +5

    You are a LEGENDARY CODER !!!
    Not joking you make amazing things that never ever anyone have even thinked of.
    Your Designs are my inspiration sir.

  • @ArtsandGadgetsStuff
    @ArtsandGadgetsStuff 3 роки тому +13

    This is what I needed for so many days, I just thought to add a comment but you did it real before even I am going to ask. Thank you so much 🙏

  • @adithyas6863
    @adithyas6863 3 роки тому +6

    You are such a maestro when it comes to css, it will actually be very helpful if you could add a voice over or add audio of you explaining stuff, I'm 100% sure this is going to be one of the go-to channels for any css related topics...
    Cheers

  • @chinamdipakpatra7295
    @chinamdipakpatra7295 3 роки тому

    i just shocked how calculator made without any js file using only HTML .... really awesome ...appreciated

  • @princeonukwili996
    @princeonukwili996 2 роки тому

    No words to describe...best CSS stylist ever. 😌😌😌

  • @tadakuniyasuda8214
    @tadakuniyasuda8214 3 роки тому +4

    vanilla Tilt is amazing.... I would never known about it if it werent for this youtube gem. Thank you .

  • @anshut-rex6522
    @anshut-rex6522 3 роки тому +3

    Your all code is best 👍 i like yours 🤠 code

  • @vilaxlord
    @vilaxlord 3 роки тому

    You are the great grand master of css❤❤❤❤❤

  • @circuitertamil-circuiter
    @circuitertamil-circuiter 3 роки тому +2

    Best ever tutorial on amazing calcutor using css !

  • @BlackMessiah122
    @BlackMessiah122 3 роки тому +6

    You sir are a gift to us!! Thank you for these amazing tutorials!!!

  • @mehedirahmanmahi3704
    @mehedirahmanmahi3704 3 роки тому

    Thanks to UA-cam algorithm, I found this channel. I'm learning many new things from here. Thank you for such quality contents

  • @vfxentity
    @vfxentity 3 роки тому

    my mans creativity is on a whole new level

  • @Maytid-rx7op
    @Maytid-rx7op 3 роки тому

    This is the magic of HTML CSS and JS

  • @xyhard8603
    @xyhard8603 3 роки тому

    Sincerly i don t regret the fact i followed you for few months

  • @sabinaxettri5721
    @sabinaxettri5721 3 роки тому

    This channel is next level channel for its content

  • @aloksingh-ii9ky
    @aloksingh-ii9ky 3 роки тому +1

    Master of css

  • @ayanansari8663
    @ayanansari8663 3 роки тому +1

    This is awesome Always you make a unic design and this time you also make a unic design thanks very much🙏🙏

  • @celphtitled8284
    @celphtitled8284 3 роки тому +5

    i have a question, why on the clear button you use "onclick = 'calc.text.value" while on the rest of the span you used "document.calc"?
    amazing tutorial btw.

  • @kenethnjoroge5313
    @kenethnjoroge5313 3 роки тому

    One word for you bro...
    LEGEND!
    You inspire me so so much man thank you for your great work,

  • @Vicky75635
    @Vicky75635 3 роки тому

    Epic legend what else left for this bro. Thanks for new trending videos

  • @creativecode9208
    @creativecode9208 3 роки тому +14

    Create A Game Using JavaScript

    • @Saidur07
      @Saidur07 3 роки тому +3

      Please create.... @online tutorials

  • @haresh3562
    @haresh3562 3 роки тому +2

    This is insane! what a beautiful quality content! Thanks buddy. ❣️

  • @rajukani100
    @rajukani100 3 роки тому

    Your Skills Are Awesome. > Always Different Style Concept. < Where You From Learn Coding ?

  • @erenyaeger3923
    @erenyaeger3923 3 роки тому +1

    just tryna to help the algorithm. Awesome video

  • @devch1094
    @devch1094 3 роки тому

    Awesome Design Bro

  • @davinascimento7044
    @davinascimento7044 3 роки тому

    Perfect!! I go make the your curso!

  • @codarangola9769
    @codarangola9769 3 роки тому

    You are the best, I love your work... one love from Angola ❤🇦🇴

  • @chandnibhatia316
    @chandnibhatia316 3 роки тому

    You are a legend ✨

  • @luizelrodrigues9496
    @luizelrodrigues9496 3 роки тому +1

    Very nice !

  • @harimv0135
    @harimv0135 3 роки тому

    No Words to say for this creativity
    Good Job!!Bhai
    Eid Mubarak✌✌🙏👏👏

  • @pranavbakare8922
    @pranavbakare8922 3 роки тому +2

    Thank you so much for such great contribution!!!! I wanted to ask can we add such things as a short project work into our resume???

  • @Saidur07
    @Saidur07 3 роки тому +2

    Please reply... try to make a TTS by HTML CSS and JavaScript. What's your opinion?

  • @ramlaaal
    @ramlaaal 3 роки тому

    mind-blowing: never saw like this before

  • @GGraphicx
    @GGraphicx 3 роки тому

    Awesome bro
    Amazing tips
    Keep it up

  • @avanessglobal
    @avanessglobal 2 роки тому

    great!!! thanks for the tutorial

  • @wrends
    @wrends 3 роки тому +1

    Beautiful!

  • @Srik609
    @Srik609 3 роки тому

    Loved it man!!!

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

    fantastic 👌👌👌

  • @maskman4821
    @maskman4821 3 роки тому

    This is freaking awesome !!!

  • @Manubalquinto
    @Manubalquinto 3 роки тому

    Really good! Thanks for sharing

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

    thank you very much

  • @runn6654
    @runn6654 3 роки тому

    thank u, this is so cewlll~~

  • @mounir101
    @mounir101 3 роки тому

    Pretty awesome!

  • @dhanavignesh8716
    @dhanavignesh8716 3 роки тому

    Awesome.............

  • @josephmartyn9247
    @josephmartyn9247 3 роки тому

    Can u try adding percentage also?

  • @ssboxer
    @ssboxer 3 роки тому +1

    This was awesome! Followed along but I've one question: My blur effect shadows behind the calculator on Vanilla-tilt.js. Is there a way to fix this?

  • @kirollos-samir
    @kirollos-samir 3 роки тому

    Thank you 👍👍👍👍

  • @MumuCoverOfficial
    @MumuCoverOfficial 3 роки тому +1

    Bermanfaat

  • @DineshkumarPuli
    @DineshkumarPuli 3 роки тому

    Nice one 🙂 👏

  • @l.graphics7605
    @l.graphics7605 3 роки тому

    Dude I love it !
    (And what’s the first song please ?)

  • @rhymekidstv
    @rhymekidstv 3 роки тому

    Please what is the name of the vs code theme? I like your vs code colour. Very nice tutorial

  • @HiteshKumar-we5yk
    @HiteshKumar-we5yk 3 роки тому

    Hello bhaiyaa kya app btaa sakte hai ke hum backspace button kaise bna sakte hai javascript ki helps se..jisse hum backspace button par click kr aur text step by step delete ho.
    Or ek function aur hai jisse hum div ko slide up/down kar sake. Jaise hum mobile mein notifications bar ko slide up/down krte hai....
    Pls bhaiyaa iss dono topic par video bna do pls 🙏

  • @CharanSingh-ki9gy
    @CharanSingh-ki9gy 3 роки тому

    Sir I already request you many times to make a horoscope website but why are you not making

  • @sunabhapanda9996
    @sunabhapanda9996 2 роки тому

    Is it responsive???

  • @abdelwahedidir
    @abdelwahedidir 3 роки тому

    Can you upload the javascript course?

  • @ati43888
    @ati43888 3 роки тому

    nice

  • @josephmartyn9247
    @josephmartyn9247 3 роки тому

    So cooooool bro

  • @ahmadsohail_yt
    @ahmadsohail_yt 3 роки тому +1

    there is one bug : When the result is printed and another value is taken then it gets concatenated with the result itself instead of appearing in a new line. Did someone fix it?

  • @monikag1604
    @monikag1604 3 роки тому

    clip-path property is not parking. Any Solutions?

  • @dautarinosvaldocarvalhodea3167
    @dautarinosvaldocarvalhodea3167 2 роки тому

    how do I use readonly and still manage to make the imput show the value, I'm not getting it?

  • @Samaelish
    @Samaelish 3 роки тому

    Great Calculator, but when I press 0 I get undefined. Also, you can type in number that start with multiple zeroes. Is there a simple fix for that?

  • @Saidur07
    @Saidur07 3 роки тому +4

    Please try to make a TTS with HTML CSS and JavaScript 🙄

  • @MuhammadFarooq-iw5fu
    @MuhammadFarooq-iw5fu 3 роки тому

    great tutorial but I am having issues with the CSS part.

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

    sir, the design is ready👍🏻 but the calculator is not working.
    when I tap to any number nothing is shown on the calculator screen.
    Please reply 🙏🏻
    Happy New year 🎉 sir

  • @ayshafarhana4103
    @ayshafarhana4103 2 роки тому

    Hai i wrote the code Correctly but i could get the calculator design could you suggest me how to get proper design

  • @okolol
    @okolol 3 роки тому

    I'm not sure if I'm the only one who mention this, but, please, change the bg music, there are so many good music out there, why did you chose "mmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmmm"?
    But you have good content, I'll try to watch it anyway(even tho my ears are suffering, lol.)
    Keep it up!!
    [ Edit ] if you don't know what kind of music that'll fit on your vid, you can try lofi, it's calming and relaxing sometimes, and ofc it's better than "mmmmmmmmmmmm" or whatever that is.

  • @whatsup_medico
    @whatsup_medico 3 роки тому

    Bro wo typography wali video kab banoge

  • @deckbietcaijhet
    @deckbietcaijhet 3 роки тому

    Can someone tell me how the span:hover is brighter than the container? These 2 are using the same background color

  • @baby23bear
    @baby23bear 3 роки тому

    My grid isn't adjusting as it is supposed to... and there's no effect on the cal after the ".container.calculator" class style
    Please guide! Thanks

  • @royaltufanoffcials
    @royaltufanoffcials 3 роки тому +1

    bro this code is not work properly

  • @BloggerProfissional
    @BloggerProfissional 3 роки тому +1

    Legal.... Parece com o tênis 3d

  • @dineshtej6120
    @dineshtej6120 3 роки тому

    Bro can u explain javascript code in this calculator.. please..!

  • @hossainkabir
    @hossainkabir 3 роки тому +2

    Cant find the *import url , can anyone help me

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

    I just copied exactly but there is no hover effect any help..??

  • @naokimc
    @naokimc 3 роки тому +1

    I got an error -
    ReferenceError: VanillaTilt is not defined
    at /:35:5
    I've also saved the vanilla-tilt.js file

  • @explosionimplosion4679
    @explosionimplosion4679 3 роки тому

    Is the backdrop-filter glitching for you guys? It's not skewing with the calculator for some reason.

  • @QnMM
    @QnMM 3 роки тому

    Can you please give the link of the source code? I love this.

    • @OnlineTutorialsYT
      @OnlineTutorialsYT  3 роки тому

      All Source Code Available here www.patreon.com/posts/source-code-how-44980706

    • @QnMM
      @QnMM 3 роки тому

      @@OnlineTutorialsYT thanks for it but it's premium, can you pls send a github repository link?

    • @xtaylor7142
      @xtaylor7142 2 роки тому

      @@QnMM make it yourself the video is only 10 mins

  • @baliyachtservices7505
    @baliyachtservices7505 3 роки тому

    damnnnn that's cool

  • @secretmystery8305
    @secretmystery8305 3 роки тому +1

    Love Content #7

  • @pilerongeorge5214
    @pilerongeorge5214 3 роки тому

    Wah! Thanks a lot dude! SUBSCCCRIIIIIIBEDDD!

  • @madinaravshanbekova9835
    @madinaravshanbekova9835 3 роки тому

    I have one question for you???

  • @nuriddinmirzaxojayev8083
    @nuriddinmirzaxojayev8083 3 роки тому

    Backdrop filter blur;-does not work :-(((

  • @ShahriarAzadEvan
    @ShahriarAzadEvan 3 роки тому

    @Irshad vai iss music ka link please

  • @jhonatanwalterarizaquispe8933
    @jhonatanwalterarizaquispe8933 3 роки тому

    1/0 infinity
    0/0 NaN

  • @pranavbakare8922
    @pranavbakare8922 3 роки тому

    HOW SHOULD GET THE SOURCE CODE CAN YOU PLZ SHARE .................

  • @hakim14369
    @hakim14369 3 роки тому

    How I can get that (url) in the CSS file

  • @franciscovasconcelos776
    @franciscovasconcelos776 3 роки тому

    Muito top

  • @ku9al._
    @ku9al._ 3 роки тому +1

    when i press the span button nothing happen no input was go in the input box

    • @akshitdandyan192
      @akshitdandyan192 3 роки тому

      You need to apply Javascript for getting functionality.

  • @zFreshx
    @zFreshx 3 роки тому

    Make Glass + Neumorphism

  • @sidharthk315
    @sidharthk315 3 роки тому

    i made a calculator weeks ago... with buttons... and used a biiiggg file of JS... now this one... with some lines of "HTML" does the same thing....lol

  • @shhdevon
    @shhdevon 3 роки тому

    i think that tiltable calculator isnt very comfortable to use

  • @planet-music
    @planet-music 3 роки тому

    Show 👍👏👏👏👏

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

    Vanilla tilt not working

  • @enlypubg
    @enlypubg 3 роки тому

    Wow!

  • @NATIC909
    @NATIC909 2 роки тому

    The buttons do not write me anything about why it is?

  • @kamilhassen395
    @kamilhassen395 3 роки тому

    I want the source code!, please!

  • @mradchemseddine9965
    @mradchemseddine9965 3 роки тому

    Beautiful work 👍but you should stop using these annoying music on your videos!

  • @haydaraliawan8764
    @haydaraliawan8764 3 роки тому

    my onclick event is not working
    Please help

  • @moiSangita
    @moiSangita 3 роки тому

    onClick = "calc.text.value = ' '" doesnt work for me