Use JQuery to create a QQ pop-up message conforming to Web standards _ jquery

This article mainly introduces how to use JQuery to create QQ pop-up messages that comply with Web standards. The pop-up message mentioned here refers to the box that goes up and down in the lower right corner of the page, here we use jQuery's Custom Animation. the pop-up message here refers to the box that rises and goes down in the lower right corner of the webpage. Here we use jQuery's Custom Animation, it seems that this custom animation is like the shape and gradient animation in flash. As long as two key frames at the beginning and end are defined, the animation process in the middle is automatically completed, you don't need to check jQuery's help document.

The basic idea is as follows:The pop-up message box is actually a p layer. After the page is loaded, we should use CSS to locate the p layer to the bottom right of the page and hide it, then, when we click the button on the page, the animation function is triggered, and the p layer starts to rise from bottom to bottom. Here we have a gradient of transparency in the process of increasing the visual sense, then there is a close button in the p layer. After clicking it, another animation function is triggered, and the p layer goes down. That's all. After thinking about it, I will start writing the code. below is mySource code of test.html:

The Code is as follows:

QQ pop-up message