Discuz!官方免费开源建站系统

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索

[分享] 【独特的登入效果....】SS使用!

[复制链接]
SSAY 发表于 2007-10-15 14:15:33 | 显示全部楼层 |阅读模式
代码如下:

找到</head>在上面加入:
  1. <script type="text/javascript">
  2. <!--
  3. function SWLogin()
  4. {
  5.         oLogin = document.getElementById("Login");
  6.         oIEBackground = document.getElementsByTagName("body");
  7.         oCSS3Background = document.getElementById("LoginBackground");
  8.         if (oLogin.style.display == "block")
  9.         {
  10.                 oLogin.style.display = "none";
  11.                 oIEBackground[0].style.filter = "";
  12.                 oCSS3Background.style.opacity = "";
  13.         }
  14.         else
  15.         {
  16.                 oLogin.style.display = "block";
  17.                 oIEBackground[0].style.filter = "alpha(opacity=6)";
  18.                 oCSS3Background.style.opacity = "0.06";
  19.         }
  20. }
  21. //-->
  22. </script>
复制代码
找到<body>在下面加入:
  1. <div id="LoginBackground">
复制代码
然后在你需要连接的地方写上
  1. <a href="#" onclick="javascript:SWLogin()">登录</a>
复制代码
然后在下面继续加代码:
  1. <div id="Login" style="width: 200px; height: 120px; padding: 0px; margin: 0px; position: absolute; top:1%; left:1%;  display: none; text-align: center;">


  2. <div id="topLogin">
  3.                                 <script src="{S_URL}/index.login-1.php?rand={eval echo rand(1, 999999)}" type="text/javascript" language="javascript"></script>
  4.                         </div>



  5. </div>
复制代码
在找到</body>的上面加入:
  1. </div>
复制代码
CSS书写如下(如果是使用官方默认的,可以不书写表单通用样式,只需书写用户相关代码:

适合(个人制作风格)
  1. /*表单通用样式-----------------------------------------------------------------------------------表单通用样式*/

  2. form { margin: 0; }
  3.         input, textarea, button, select { font: 1em Arial, Helvetica, sans-serif; }
  4.         button { height: 1.8em; padding: 0 0.3em; background: #E2F0F9; cursor: pointer; border: 1px solid;
  5.                 border-top-color: #C9E3F0; border-right-color: #86B9D6; border-bottom-color: #86B9D6; border-left-color: #C9E3F0; }
  6.         label { cursor: pointer; margin-right: 0.5em; }
  7.        
  8.         /*-----------------------------------------------------------------------------------用户相关*/

  9. /*登陆*/
  10. .inputLogin{font-family:Tahoma,Arial,"宋体";font-size:12px;line-height:15px;color:#333;height:14px;border:1px #CCCCCC solid;margin-bottom:2px;}
  11. .resiveWord{font-weight:bold;}
  12. .resiveButt{margin:0 15px 0 10px;}
  13. .resiveInput{margin-top:2px;}
  14. #topLogin{width:950px;height:26px;margin:0 auto;padding:2px 10px 0 10px;background:#F9F9F9;border-top:none;}
  15. #topLogin div{line-height:25px;float:left;}
  16. .end_margin_a{padding-right:38px;}
  17. .end_margin_b{margin-right:48px;}
  18. .userBar li{float:left;}
  19. .userBar span{font-family:"宋体";color:#06F;}
  20. .userBara{color:#06F;}
  21. #topLogin{border:1px #90A4A8 solid;}
复制代码
OK完工! 







下面是登入器和效果图!

[ 本帖最后由 SSAY 于 2007-10-15 14:18 编辑 ]

评分

3

查看全部评分

折宝亭 发表于 2007-10-15 14:22:07 | 显示全部楼层
强悍.......................
回复

使用道具 举报

120843697 发表于 2007-10-15 14:32:02 | 显示全部楼层
提示: 作者被禁止或删除 内容自动屏蔽
回复

使用道具 举报

hanliou2008 发表于 2007-10-15 15:05:30 | 显示全部楼层
强啊
这个很好!!!!!
回复

使用道具 举报

gokocn 发表于 2007-10-15 15:19:30 | 显示全部楼层
不错!!!透明了
回复

使用道具 举报

士心亘 发表于 2007-10-15 16:07:51 | 显示全部楼层
学习。 。
回复

使用道具 举报

yoyorest 发表于 2007-10-15 16:36:57 | 显示全部楼层
强,学习了
回复

使用道具 举报

叶海燕 发表于 2007-10-15 18:06:20 | 显示全部楼层
不错啊!小金,有没有人用过,我看下。
回复

使用道具 举报

逍遥候 发表于 2007-10-15 18:29:35 | 显示全部楼层
不错,帮顶中
回复

使用道具 举报

超级管埋员 发表于 2007-10-15 20:06:24 | 显示全部楼层
:) :)
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|小黑屋|Discuz! 官方站 ( 皖ICP备16010102号 )star

GMT+8, 2025-1-10 11:14 , Processed in 0.037234 second(s), 6 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.

快速回复 返回顶部 返回列表