Popup with blurred background Using CSS3 And Vanilla Javascript | Modal

Enroll My Course : Next Level CSS Animation and Hover Effects
www.udemy.com/course/css-hove...
------------------
Join Our Channel Membership And Get Source Code Everyday
Join : / @onlinetutorialsyt
------------------
Please LIKE our Facebook page for daily updates...
/ online-tutorial-html-c...

[@crazy_vulcan]

Yes...this is exactly something I needed.. great job as always.

[@tonimaunde]

The best modal example I've seen so far. Very instructive even though there is no narration. Thank you.

[@monahengramokhoro]

This is exactly what I been looking for!!!😭😭😭😭

[@sinanouri5035]

Thank you, I love you, we love this page

[@siddhartharoy5263]

That's a great tutorial.

[@williamurquhart5169]

Such a refreshing change to have some beautiful music accompanying a coding vid. Great job :)

[@MukeshSharma-xd4dn]

Wow..... so nice!!! Mindblowing

[@josuecaceres5784]

I love this.
Greetings from Honduras

[@engel8486]

Awesome, thanks for that, I will use this!

[@VideoDudie]

😲😲😲😲😲Just woooow.....

[@ahmadalmuosawey556]

you are amazing......
thanks for every thing
great job

[@jmbeatsbbx]

Its something I like to do when revealing the menu from the hamburger. I also darken the page a bit to make the contrast stronger

[@siddhartharoy5263]

Yay. That's awesome.

[@queekao3540]

Thank for this tutorial☺️

[@veeresh4441]

Thanks for helping me to learn . 🤟

[@ratulhossainofficial]

Awesome tutorial BOSS :)

[@unbun5153]

I'm big fan... Thanks a lot luv u..

[@aayushpatil7514]

Love. Your work keep it up.

[@vijayakumar_3]

Thank you so much Brother...❤❤💕

[@user-tf9pz8lj2k]

Greeeaat ))) thank's you for all video

[@jerfita93]

You´re amazing!!!

[@wholetomy]

thank you so much, your video saved my life

[@vijayakumar_3]

Awesome work...👌

[@blasalvadorwii]

Amazing !

[@mohammadarwaaz5955]

Fantastic sir👍

[@rammaheshwari9748]

Very helpful 💎

[@danyeol1]

Super clean code

[@sachamarcus9878]

Thank you so much !

[@suzanmagar6806]

awesome man

[@codewithconsistency]

awesome!! thank you so much !!

[@larrysonjoelrakotonarivo3802]

Thanks for your help

[@thesimonblog]

Thank you. This video helped me👍

[@dipenpatel9516]

Really helped a lot!!!!!!!

[@phanntuan]

Thank you very much! i like your video! it's good!

[@CorawlKings]

You earned a sub

[@smurffronda2951]

thanks man, have a great week :)

[@broadenmymind5793]

what an amazing video! Thanks for your instruction. (What would i can do, if I want to add the feature that when I click outside the modal, the modal will be closed)

[@arunrajs6572]

Hi bro, pls make an video on creating a beautiful modal which will be displayed on a page load(automatically)..

[@diogohenriquesc]

awesome video!!

[@ck0024]

*Very but cool.* 👍

[@AkbaraliQ]

Background Music 👌🏻

[@ImpendingSole13]

Thank you so much

[@tadakuniyasuda8214]

This is better than bootstrap modal

[@abboskhamidullaev3948]

*very good *

[@stsgta7382]

cognitive lesson. wanted to see a lesson with two different pop-ups

[@andreawijayakusuma6008]

Thanks bro. You make something with java script. I hope, next you can make some video with java script again. I really like your video 👍

[@mysteriousgamer497]

thanks a lot (:

[@voidshard4053]

Hey online tutorials i liked the video. Can you please tackle javascript intersection observer API in the future

[@ashiqulislam7277]

good job. man

[@diygenix3192]

power of youtube

[@hackerprime9722]

If you want it to run immediately on/as the page loads/loading use this within the script tag:
window.onload = function() {
var blur = document.getElementById('blur');
blur.classList.toggle('active')
var popup = document.getElementById('popup');
popup.classList.toggle('active')
};

[@Doliprane-1k]

I like the song with it

[@adyamusicdigital7272]

thanks 😁😁

[@bikerbike]

gracias!

[@iqraangel4824]

Nice

[@Actor_mp]

Hello, awesome work!
one question, What is the meaning of > type="text/css" < in the link of css styles?

[@priyadarshinichettiar6750]

Can you please create a video for drag and drop of buttons, text boxes from a list / toolbox . The aim is to create a custom toolbox with drag and drop of tools to a form.

[@dulinahiyarapitiya3553]

Thx bro

[@rohanahuja2913]

REALLY COOL GUY, SRLSY

[@mohammedamin3908]

Amazing work! I was also looking for something similar. I wanted to ask you why don't you code in ES6?

[@slychnidos]

ES6/ES7 or ECMAScript.... actually is vanilla JS. ES6 is just 2015 version of vanilla JS.

[@peybro]

@@slychnidos but the question is still valid: why doesn't he use its Syntax then

[@omerinan1854]

What code should I write to navigate up and down inside the popup page? (please answer I need this)

[@mbabuofficial2240]

Like this

[@Kwansmusic]

How about in situations when the child element's position is fixed and you apply filter on it parent element ? wouldn't that move position fixed on the child element to the parent element ? How would you "fix" this problem ?

[@danishshirsangi2438]

Make videos of basic js with html/css..if possible:)

[@syediqbalahmed3176]

good

[@diveshkumar2005]

Really liked ur video. can u please provide the source code??.

[@dreamrains1021]

Cool

[@CoolScratcher]

agreed

[@viniciuscalixto6782]

thanks for the vídeo! How to assign another popup? I have a list of products and I would like to link a popup for each...you could to help me?

[@o.voytyn]

Can i leave a request for the next videos ?) Can you make a few tutorials how to work/animate SVG and make some cool svg animations.Thank you)

[@peybro]

Not saying that he shouldn't do it but there are literally already thousands of videos on it

[@o.voytyn]

@@peybro There are already thousands of videos on topics that we see here. Why are you here ?

[@ujjwal_kushwaha]

Please can you make that hower effect in which is in your intro which is like water color

[@heydevday]

this is what i need right now. :v

[@vigneshreddy9262]

1st comment hurray......

[@vigneshreddy9262]

Music too boring

[@crazy_vulcan]

I actually prefer the instrumental music over the singing.

[@jaxmany05]

Igual ponle el siencio y puedes poner la musica que mas te agrade.

[@adolfjamesurian6510]

Can u make a navbar tutorial with blurr background that doesnt affext the texts

[@sabbirkhondokar7946]

Awesome . YOu are creator of Booossss @online

[@sahilmathur4199]

Hello, please make a video on automatic popup using javascript..

[@deveshmittal2497]

There are no errors in my implementation.. The code is entirely same.. but the blur and the popup just don't work... Please help :(

[@nejan_s]

Hey, could you please create a video about, 'How to make a working cart for an e-commerce website ?'

[@TechAppz15]

I want to display a banner after loading a page how to make it

[@akhiljithk7173]

how did the close button automatically worked?

[@manavlakhanpal759]

Can we add more popup in this?

[@supriyoghatak485]

sir how will it work for multiple images

[@wilsonpraise3906]

Hello Sir... Please can you create a tutorial on how to create an automatic pop-up on load that shows only once each day

[@akashprashar3615]

Good mentors.......but how to close pop

[@TechnoSG]

That's good but if u provide source code then its like better for Subscriber

[@sharvilpatel9714]

Is It Responsive??

[@KIRANKUMAR-qy3cy]

I want to become like you sir .. how to develop our knowledge in CSS and JAVASCRIPT.?

[@muneershakeel]

Make 10 css designs, then 100, then 1000
You will be master. 👍🏻👍🏻😇

[@ayushsharma8851]

Is this resoinsive?

[@mattsum7723]

how do you stack this with multiple images?

[@jyotitechnology21m31]

Bro your video is superb but it's a very fast plz u can upload a video so speed time very slow plz bro

[@renignacio1546]

What to do if there are more links to be popup?

[@samking4206]

Please make some completely website sir please

[@jiteshjoshi4161]

can we link that with another page

[@ramanav3139]

hi bro can you do video on when click on login button in navbar will login in form in popup and background will bluered and also submit of that form change that website to user profile

[@donianggara5349]

Can i request plus/minus qty? Like a cart at online shop

[@suman-majhi]

Plz make dynamic graph... Graph from excel or google spreadsheet... 🙏🙏🙏🙏

[@peybro]

Save excel as csv file then read it via python or php and the data over to Javascript

[@suman-majhi]

@@peybro online excel

[@yoho8408]

😋😋😋😍😍😍😍😍

[@Ammukutti07]

can you please make this in mobile view or like responsive mode
do you have any code please let me know

[@pythonmacho9954]

can I/ get a source of this program plz

[@user-he8io9tr8m]

I'll do. No js add class active to popup. Css .container#blur.active ~ #popup

[@Steph-uk6ys]

How to close it when click outside the popup? Help please