How to create a pop-up window effect with jQuery

This time I will show you how to create a pop-up window effect with jQuery. The pop-up window effect is often used in our projects. This article will give you a good analysis.

Points used:

jQuery creation:

$('
');

Position of the pop-up window:

oLogin.css('left',($(window).width()-oLogin.outerWidth())/2);
oLogin.css('top',($(window).width()-oLogin.outerHeight())/2);

When the scroll bar scrolls, the position of the pop-up window changes:

$(window).on("resize scroll",function(){
oLogin.css('left',($(window).width()-oLogin.outerWidth())/2+$(window).scrollLeft());
oLogin.css('top',($(window).width()-oLogin.outerHeight())/2+$(window).scrollTop());
   })

I believe you have mastered the method after reading the above introduction. For more exciting information, please pay attention to other related articles on the php Chinese website!

Related reading:

How can ajax read local json

How ES6 uses the Set data structure to operate arrays

About HTTP/2 server push

The above is the detailed content of How to create a pop-up window effect with jQuery. For more information, please follow other related articles on the PHP Chinese website!