Javascript Project: Javascript PopUp Window

Поделиться
HTML-код
  • Опубликовано: 2 июн 2024
  • support this channel: / @harry-qh8yq
    Javascript Project: Javascript PopUp Window - in this video i'll show you how to create a simple pop up window using html css and javascript for beginners.
    Thank You for watching!
    -----------------------------------------------------------------------------------------------------------------------
    find the page here: redouand.github.io/Pop-Up-Win...
    -----------------------------------------------------------------------------------------------------------------------
    Source Code: github.com/redouand/Pop-Up-Wi...
    ------------------------------------------------------------------------------------------------------------------------
    #JavaScript #WebDevelopment #Modal
    [Tags] :
    html popup,popup window,popup model,how to create a popup,how to create a popup in html,how to create a popup form in html, how to create a modal in javascript, create a modal in html css and javascript, javascript popup window, js popup, beginners javascript project beginners, pure javascript window popup
  • НаукаНаука

Комментарии • 98

  • @Harry-qh8yq
    @Harry-qh8yq 3 года назад +2

    hello sir its Harry :)) sub to Red and me check our stuff out!! >:3

  • @sawkares
    @sawkares 3 года назад +2

    Best Video of JavaScript til now and Self Explanatory !!

  • @AbdurRahman-vr4tn
    @AbdurRahman-vr4tn 3 года назад +1

    It was so informative for me..Thank you so much bro

  • @reinaogo7161
    @reinaogo7161 3 года назад +3

    How could someone put a “dislike” for this amazing tutorial??
    Thank you very much for sharing your knowledge^^

    • @arseneawounou180
      @arseneawounou180 3 года назад

      Maybe they think it's the download button :)

  • @fatihcamgoz
    @fatihcamgoz 3 года назад

    Great tutorial keep it up! Subbed and liked the video!

  • @kerimselki8811
    @kerimselki8811 4 года назад +1

    great good job ! thank you.

  • @himalayagupta7744
    @himalayagupta7744 3 года назад +4

    This is some great stuff, keep them coming. Thank you for sharing your knowledge with us

  • @mostafahejabi1558
    @mostafahejabi1558 3 года назад

    that's great do more videos like that & thank u

  • @claresparkes8024
    @claresparkes8024 4 года назад +2

    Great video please keep them coming

    • @ProMakerDev
      @ProMakerDev  4 года назад +1

      Really appreciate it clare

  • @BUDX
    @BUDX 4 года назад +2

    Nice video brother
    Keep making such videos for us to learn

  • @salimeholli7006
    @salimeholli7006 4 года назад +2

    That's lit , keep up the good work man❤

  • @riteshmahajan5209
    @riteshmahajan5209 3 года назад

    a wonderful project to understand how html, css and javascript work together. .. thanks :))

  • @amarnatharumugam6407
    @amarnatharumugam6407 3 года назад

    Nice one dude ✌

  • @tanzimbinashraf2853
    @tanzimbinashraf2853 4 года назад +3

    really cool... thanks bro..

  • @ramsir011
    @ramsir011 3 года назад +1

    undoubtedly very much helpful for the beginner like me...thank you so much for uploading such wonderful projects

    • @ProMakerDev
      @ProMakerDev  3 года назад

      you're welcome, good friend, im happy to help, and big thanks for the support

  • @yahiahasan2722
    @yahiahasan2722 3 года назад

    thank u so much i lear centering item in css and alote of idea and ..... you r the best

  • @pulok9909
    @pulok9909 4 года назад +1

    super video guy! thanks for that. I enjoyed it so much. carry on...

    • @ProMakerDev
      @ProMakerDev  4 года назад

      wow, im really happy to hear that from you

  • @shahinulislam6145
    @shahinulislam6145 3 года назад

    Awesome bro!! Keep it up. Thanks

  • @codeinswahili9505
    @codeinswahili9505 4 года назад

    This is a great tutorial. We need more like this

  • @farooqwahab8056
    @farooqwahab8056 4 года назад

    Many thanks for this great effort to help the beginners.

    • @ProMakerDev
      @ProMakerDev  4 года назад

      You're very welcome!, be sure to check out my channel, and subscribe cos im uploading some some fun js projects

  • @faiztchekiken2680
    @faiztchekiken2680 4 года назад +2

    Keep it up ! ⚡🔥

  • @smartone5531
    @smartone5531 4 года назад +1

    thanks for the great content

  • @theodorenick2866
    @theodorenick2866 3 года назад

    super!

  • @shubhamthakur9161
    @shubhamthakur9161 4 года назад +2

    Amazing sir...a great explanation

    • @ProMakerDev
      @ProMakerDev  4 года назад +2

      i'm happy you liked it!, check out my channel if you like, it'll be a big support.

    • @shubhamthakur9161
      @shubhamthakur9161 4 года назад +1

      Getting an error sir on event listner.
      var firstpage = document.querySelector("firstpage"),
      startbtn = document.querySelector('startbtn')
      maindiv = document.querySelector('maindiv');
      startbtn.addEventListener('click', start);
      function start() {
      maindiv.style.display = "block";
      }

  • @MohamedMohamed-vp6iy
    @MohamedMohamed-vp6iy 3 года назад

    im a beginner in JS and this tutorial is a peace of cake .thanks from Egypt

  • @coldsir5406
    @coldsir5406 4 года назад +1

    done, good tutorial

    • @ProMakerDev
      @ProMakerDev  4 года назад +2

      thank you buddy, check out my other javascript project in my channel, and sub if you want to support a startup

    • @coldsir5406
      @coldsir5406 4 года назад

      @@ProMakerDev deal

  • @zdarofMERGAITES
    @zdarofMERGAITES 4 года назад

    Awesome.

  • @manikandand2541
    @manikandand2541 3 года назад

    thanks a lot sir hats off

  • @musicvstime9559
    @musicvstime9559 4 года назад +2

    Tnx bro pls more js projects !

    • @ProMakerDev
      @ProMakerDev  4 года назад +3

      i will man, just for you ;)

  • @ahmedhameed5469
    @ahmedhameed5469 4 года назад +2

    ^^ good work
    thx

  • @salwacoding5661
    @salwacoding5661 4 года назад

    This is exactly what I want to start practice web development , highly appriceted Pro keep up!
    sorry for the pad syntax

    • @ProMakerDev
      @ProMakerDev  4 года назад +1

      thanks, and it's not problem, you're good!

  • @xiaoxuguo3110
    @xiaoxuguo3110 4 года назад

    You deserve more followers!

    • @ProMakerDev
      @ProMakerDev  4 года назад

      haha, thanks a lot
      i really appriciate it

  • @vinayshah573
    @vinayshah573 4 года назад +1

    Loved these video plz create more javascript videos like these and use bootstrap plz.

    • @ProMakerDev
      @ProMakerDev  4 года назад

      thanks for the love, and yes, i'll do some bootstrap projects soon

  • @babaproduction2921
    @babaproduction2921 4 года назад +1

    i m beginner at JS still i injoy nice

    • @ProMakerDev
      @ProMakerDev  4 года назад

      wow, im happy to hear that from you, thanks alot

  • @richaaggarwal2337
    @richaaggarwal2337 4 года назад +2

    This is very Helpfull Thank you

  • @sawkares
    @sawkares 3 года назад

    Please make more videos on javascript !

    • @ProMakerDev
      @ProMakerDev  3 года назад

      i will soon, bro, thanks for the support

  • @zdarofMERGAITES
    @zdarofMERGAITES 4 года назад

    You are going to be big :)

    • @ProMakerDev
      @ProMakerDev  4 года назад

      hahaha i hope so, thank you for watching

  • @85b103
    @85b103 4 года назад +5

    Love the video! Do you know how to make it split that’s basically my design for my portfolio.

    • @ProMakerDev
      @ProMakerDev  4 года назад

      i dind't really get you, you want the modal to split when reload ?

    • @85b103
      @85b103 4 года назад

      Yes sorry was finish up stuff but yes idk I might be able to create to diva and make it slice idk if that’s possible thanks!!

  • @climxvisual9684
    @climxvisual9684 4 года назад +1

    thank you

  • @stefanpfadt4353
    @stefanpfadt4353 2 года назад

    WOW! can i make the popup only appear when a specific user clicks on it, e.g. guest?

  • @ProMakerDev
    @ProMakerDev  4 года назад +6

    watch another another fun project on how to make keyboard shortcuts with javascript in 8 min (hotkeys) => ruclips.net/video/XJohoWGOv0k/видео.html

    • @AliShah-vw6tw
      @AliShah-vw6tw 4 года назад +1

      That's amazing brother. Keep it up. Can you please give me your Whats app number?

    • @ProMakerDev
      @ProMakerDev  4 года назад +1

      sorry, i do not use whatsapp, but i do use facebook and instagram, contact me here instagram.com/promakerdev/

    • @AliShah-vw6tw
      @AliShah-vw6tw 4 года назад

      @@ProMakerDev NP. Thanks

  • @anarchism_in
    @anarchism_in 4 года назад +3

    great, thank you) But couldn't understand why you gave position absolute and relative to the same element? is it possible?

    • @ProMakerDev
      @ProMakerDev  4 года назад +3

      Oops that was a mistake. didn't notice it until now, thanks. so when there is position absolute, there is no neeed to position it relative because it is relative by default. like... when the parent element is absolute, if the child is absolute, it will be positioned relatively to its parent even though the parent doesn't have '"Position: relative" but just because it has absolulte, that makes it relative as well, hope you get it. thanks for letting me know.

  • @muhammadhamzaalirajpoot5721
    @muhammadhamzaalirajpoot5721 3 года назад

    which code editor do you are using

  • @naheedfaiz268
    @naheedfaiz268 4 года назад

    I am not getting the sourse code of above video eventhough i download the mentioned link in the description box and went through it but not got it

  • @panecosmin2893
    @panecosmin2893 4 года назад +2

    So cool. I dont understand one thing on the last function. Why we target the model-parent function. I thought that we should target section because when we click on the section, the modal disappear. I dont understand this :(

    • @ProMakerDev
      @ProMakerDev  4 года назад +1

      because then if we clicked anywhere on the screen the modal will disappear, even if we clicked on the main modal (the white box with the text), even if we clicked there the modal will disappear

    • @panecosmin2893
      @panecosmin2893 4 года назад +2

      @@ProMakerDev yes but I think that we need to target the section. 🤷‍♂️😩 when we click the section, model disappear

  • @ishaansinha9623
    @ishaansinha9623 3 года назад

    hey i am clicking on that button but my modal is not popping up. Debugged it multiple times but not working. can u pls help me out

  • @subhamgupta1544
    @subhamgupta1544 4 года назад +1

    I learned how to blur an element

    • @ProMakerDev
      @ProMakerDev  4 года назад

      oh, I am happy you learned something new, consider supporting the channel from time to time

  • @animetoon2061
    @animetoon2061 4 года назад +3

    hy man i hope you remember me !

    • @ProMakerDev
      @ProMakerDev  4 года назад +1

      Hell yeah, i do! you can add me on my social media to be in touch, i have them linked to my channel

  • @zdarofMERGAITES
    @zdarofMERGAITES 4 года назад +1

    Could you upload project files in the description?

    • @ProMakerDev
      @ProMakerDev  4 года назад

      sure i will, right when i find them, it's really messy on here... haha

  • @rayhan4259
    @rayhan4259 3 года назад +1

    why downloading is disabled
    ?????????

    • @ProMakerDev
      @ProMakerDev  3 года назад

      oh is it?, idk about that, thank you for letting me know

  • @mussegelle222
    @mussegelle222 3 года назад

    i can see the source code

  • @Alimca1921
    @Alimca1921 3 года назад

    Wach 3omghy