零基础学做网站培训介绍

当前位置:

DEDECMS网站登录框如何制作成弹窗登录

DEDECMS网站的登录页面是独立的页面,用户登录时需要通过链接进入DEDECMS登录页面进行登录。下面介绍一下DEDECMS网站如何制作弹窗登录框的方法。

DEDECMS网站登录框如何制作成弹窗登录

方法/步骤

第一步:将DEDECMS登录页面的代码放到文章页面模板代码特别下方;


<p class="login bor usrdenlu">

<h6>VIP学员登录</h6>

<p class="main">

<form name='form1' method='POST' action='/member/index_do.php'>

<input type="hidden" name="fmdo" value="login">

<input type="hidden" name="dopost" value="login">

<input type="hidden" name="gourl" value="<?php if(!empty($gourl)) echo $gourl;?>">

<ul>

<li> <span>会员名:</span>

<input id="txtUsername" class="text login_from" type="text" name="userid"/>

<a target="_blank" href="/bm.html">立即报名</a>

</li>

<li> <span>&nbsp;&nbsp;&nbsp;码:</span>

<input id="txtPassword" class="text login_from2" type="password" name="pwd"/>

</li>

<li> <span>验证码:</span>

<input id="vdcode" class="text login_from3" type="text" style="width: 50px; text-transform: uppercase;" name="vdcode"/>

<img id="vdimgck" align="absmiddle" onclick="this.src=this.src+'?'" style="cursor: pointer;" alt="看不清?点击更换" src="/include/vdimgck.php"/>

</li>

<li style="display:none;"> <span>有效期:</span>

<input type="radio" checked="checked" value="2592000" name="keeptime" id="ra1"/>

<label for="ra1">一个月</label>

<input type="radio" value="604800" name="keeptime" id="ra2"/>

<label for="ra2">一周</label>

<input type="radio" value="86400" name="keeptime" id="ra3"/>

<label for="ra3">一天</label>

<input type="radio" value="0" name="keeptime" id="ra4"/>

<label for="ra4">即时</label></li>

<li>

<input type="hidden" value="<?php echo $url_this;?>" name="nowurl" />

<button id="btnSignCheck" class="button2" type="submit" style="width:100px;color:green;">&nbsp;</button> </li>

</ul>

</form>

</p>

<span><a href="javascript:;" class="flbc" onclick="hideWindow('login', 0, 1);" title="关闭">关闭</a></span>

</p>

第二步:添加一些CSS样式代码,让DEDECMS登录框默认为隐藏;


.usrdenlu{display:none;width:400px;height:280px;padding:20px 50px;font-size:16px;position:fixed;z-index:999;top:50%;left:50%;margin-top:-200px;margin-left:-300px;background:#fff;border:7px solid #9999994f;border-radius:6px;color:#333;}

.usrdenlu li{padding:10px 0;}

.usrdenlu h6{padding:10px 0;border-bottom:2px solid green;font-size:16px;margin:0;margin-bottom:20px;}

.flbc {

width: 20px;

height: 20px;

overflow: hidden;

text-indent: -9999px;

background: url(https://www.xuewangzhan.net/vip/static/image/common/cls.gif) no-repeat 0 0;

cursor: pointer;

position:absolute;

top:10px;

right:10px;

}

.usrdenlu input{

height: 30px !important;

line-height: 30px !important;

font-size: 16px !important;

}

第三步:放入JQUERY代码,实现点击按钮时,弹出DEDECMS登录框;


<script>

$(".xydenlu").click(

function(){

$(".usrdenlu").show();

});

$(".flbc").click(

function(){

$(".usrdenlu").hide();

});

</script>

这样就制作好了DEDECMS网站弹窗登录框了。

相关阅读:

怎么给弹出窗口层添加关闭按钮

如何实现超链接弹窗打开

如何给button按钮添加点击弹出窗口(jquery事件)

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程

  • Wordpress与dedecms是二款国内使用量最大的建网站程序,都可以用来制作各类型网站。下面是Wordpress与dedecms程序的不同点: 1、wordpres
  • 分享一个DEDECMS织梦淘客模板,个人比较喜欢使用DEDECMS程序,后台不需要怎么开发,这是我学习了学做网站论坛的织梦仿站课程,自己仿的一个淘客网站,
  • dedecms全站伪静态教程分为五部分,包括“Apache设置、.htaccess文件设置、首页伪静态、列表页伪静态、文章页伪静态”。一、Apache文件设置
  • 之前有很多建网站学员反映,自己学习了wordpress教程,制作了网站,但有时会碰到wordpres后台无法登录,密码确认无误,空间没有问题,之前也成功登录
  • 使用wordpress程序建网站的学员,总是容易出现错误,而且有些错误会让你手足无措。比如你修改了网站的地址。当你把wordpress程序站点地址改掉,然
  • 有些学员在做了自己的网站之后,有时碰到了登录网站后台登录不进去的情况,这是什么原因造成的呢?我们在课程里讲到期wp网站的后台登录方法是:ht
  • 问:老师,wordpress有没有前端弹出的登陆/注册窗口的插件介绍,或者有什么代码可以实现这样的功能?就是当用户点击注册或者登录时,就弹出一个注
  • 插件介绍使用wordpress做下载站的时候,可以使用wordpress下载弹窗插件实现,用户点击下载链接时就弹出一个下载页面框,框里面可以投放各类广告或者
  • 在学做网站论坛的HTML入门教程中,我们介绍了超链接是建网站过程中特别常用的一个标签。超链接常见打开方式有本窗口打开和新窗口打开。今天要介绍