很多做网站的人在做门户资讯网站的时候，都喜欢在主页顶部的位置来个横向的会员登陆。而dede的会员登陆则是在右边的。那到底要如何来实现这个功能呢？请先看效果图。

 

下面我们来一步一步修改！ 

首先在index.html中删掉原来的登陆代码，在头部文件head.html加入以下新的代码，代码如下：

<div class="header_top"> <div class="w960 center"> <span class="time" id="time"> <table border="0" align="center" > <tr><td> <div id="_userlogin"> <div class="userlogin"> <form name="userlogin" action="{dede:global.cfg_memberurl/}/index_do.php" method="POST"> <input type="hidden" name="fmdo" value="login" /> <input type="hidden" name="dopost" value="login" /> <input type="hidden" name="keeptime" value="604800" /> <div class="fb">用户名:<input type="text" name="userid" size="18" class="ipt-txt" /> 密码:<input type="password" name="pwd" size="18" class="ipt-txt" /> 验证码:<input type="text" name="vdcode" size="8" class="ipt-txt" /> <img align="center" src="{dede:global.cfg_cmsurl/}/include/vdimgck.php" /> <button type="submit" class="btn-1">登录</button> <a href="{dede:global.cfg_memberurl/}/index_do.php?fmdo=user&dopost=regnew">注册帐号</a> <a href="{dede:global.cfg_memberurl/}/resetpassword.php">忘记密码?</a> </form> </div> </div> <!-- /userlogin --> <script language="Javascript" type="text/Javascript">CheckLogin();</script> </td></tr></table> </span> <div class="toplinks"><a href=""onclick="this.style.behavior='url(#default#homepage)'; this.setHomePage('{dede:global.cfg_basehost/}');">设为主页</a> | <a href="Javascript:window.external.AddFavorite('{dede:global.cfg_basehost/}',' {dede:global.cfg_webname/}')">加入收藏</a> | <a href="{dede:global.cfg_cmsurl/}/data/sitemap.html" target="_blank">网站导航</a> | <a href="http://www.jb51.net">联系我们</a></div> </div> </div>

HTML代码现在我们已经有了，下面把上面代码中用到的

CSS

样式完善了： 

/*---------- head ---------*/ .header{ width:100%; width:960px; margin:auto; overflow:hidden; } .header_top{ height:32px!important; height:31px; line-height:32px; color:#676767; overflow:hidden; background:url(../images/top_bg.gif) repeat-x; } .center{ margin:0px auto; } .w960{ width:960px; /*position:relative;*/ } .header_top .time{ float:left; padding-left:10px; } .header_top .toplinks{ float:right; text-align:right; } .header_top .toplinks a{ margin:0 5px; } .header .top{ clear:both; overflow:hidden; margin-top:10px; } .header .title{ float:left; } .header .title h1 a{ width:386px; height:58px; display:block; overflow:hidden; } .header .banner{ width:434px; height:55px; float:right; margin-left:20px; overflow:hidden; } .ipt-txt{ width:100px; border:1px #CFCFCF solid; } .fb{ color:#333333; } .btn-1{ background: url("../images/comm-bt.gif") no-repeat scroll 0 0 transparent; border: medium none; color: #585858; cursor: pointer; height: 24px; letter-spacing: 1px; line-height: 25px; overflow: hidden; width: 70px; }

HTML代码和CSS都有了，现在显示是没问题了，但要正常登入，还少一些JS文件要加载： 

<script language="Javascript" type="text/Javascript" src="{dede:global.cfg_cmsurl/}/include/dedeajax2.js"></script> <script language="Javascript" type="text/Javascript"> <!-- $(function(){ $("a[_for]").mouseover(function(){ $(this).parents().children("a[_for]").removeClass("thisclass").parents().children("dd").hide(); $(this).addClass("thisclass").blur(); $("#"+$(this).attr("_for")).show(); }); $("a[_for=uc_member]").mouseover(); $("a[_for=flink_1]").mouseover(); }); function CheckLogin(){ var taget_obj = document.getElementById('_userlogin'); myajax = new DedeAjax(taget_obj,false,false,'','',''); myajax.SendGet2("{dede:global.cfg_cmspath/}/member/ajax_loginsta.php"); DedeXHTTP = null; } --> </script>