当前位置:Gxlcms > css > css和js实现弹出登录居中界面教程

css和js实现弹出登录居中界面教程

时间:2021-07-01 10:21:17 帮助过:15人阅读

我们登录一个网站的时候经常会弹出一个居中的窗口,本文我们就主要介绍css和js实现弹出登录居中界面,非常不错,具有参考借鉴价值,需要的朋友可以参考下。

我实现的这个和许多网站上的登录弹出窗口差不多,大家举一反三,先看我写完后的结果。

这里写图片描述

点击创建相册后

这里写图片描述

会在这个屏幕的中间显示创建相册的表单,整个背景颜色变暗,点击右上角的X会关闭这个表单。

html代码

创建按钮


<li id="create"><a href="#form" rel="external nofollow" ><span>创建相册</span></a></li>


背景p和表单p



JavaScript代码



主要原理是改变背景p和表单p的display属性,值为block时显示,值为none时元素消失。而position:fixed; 是相对于当前窗口的。

相关推荐:

使用PHP实现用户登录和注册的功能

用html5和css3写出登录页面教程

如何用JQuery写出登录弹出框

以上就是css和js实现弹出登录居中界面教程的详细内容,更多请关注Gxl网其它相关文章!

人气教程排行