您的位置:首页 > 其它

登录,注册,个人信息,退出的隐藏和出现

2016-08-09 12:30 543 查看
先上效果图

1.未登录之前,隐藏个人信息和退出



2.登陆后,隐藏登陆和注册按钮,显示用户头像



3.点击头像,显示下拉列表



先上jquery代码

//注册,登录,个人信息,退出按钮的隐藏和出现
$('#member, #logout').hide();
if ($.cookie('username')) {
$('#member,#logout').show();
$('#reg_a,#login_a').hide();
} else {
$('#member,#logout').hide();
$('#reg_a,#login_a').show();
}


html代码

1.两个按钮

<div class="double">
<button class="btn btn-success" data-toggle="modal"
data-target="#myModal" data-backdrop="static" id="login_a">即刻登陆</button>
<button class="btn btn-danger" data-toggle="modal"
data-target="#myModal1" data-backdrop="static" id="reg_a">马上注册</button>
</div>


2.个人信息及退出

<div class="user" style="width: 200px; height: 200px; float: right;padding-top: 40px;"
id="member">
<div class="dropdown">
<img src="__PUBLIC__/Uploads/{$userInfo.filename}"
alt="{$Think.session.username}" width="100px" height="100px"
class="img-circle dropdown" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="true"
style="-moz-border-radius: 50%; -webkit-border-radius: 50%; border-radius: 50%; overflow: hidden;">
<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
<li class="dropdown-header">
<!-- {$Think.session.username} -->{$userInfo.username}
</li>
<li><a href="#" data-toggle="modal" data-target="#myModal3"
data-backdrop="static">账号设置</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="__URL__/doLogout" id="logout">退出</a></li>
</ul>
</div>
</div>


本文地址:http://liuyanzhao.com/3498.html

转载请注明
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: 
相关文章推荐