精仿DiscuzX2右上角独立登入框效果（集成验证码问答）

PctDK

<style type="text/css">#umenu .loginform input.txt {margin:4px 3px 3px 5px;height:17px; line-height:17px; padding:2px 4px;border-top:#848484 1px solid;border-left:#848484 1px solid;border-right:#e0e0e0 1px solid;border-bottom:#e0e0e0 1px solid; width:120px;}
8 O. ?0 D5 ~* B, ^! l$ d#umenu .checkbox {vertical-align:middle; margin:0px 0px 1px 0px;}
/ {$ p3 p' u; g2 S#umenu .qqlogin {border-right:1px solid #ddd; margin-right:10px; padding-right:5px;text-align:center;margin-top:5px;}; h; `0 F/ P. }/ S- F/ O7 ?, {
#umenu {z-index:888;}6 X# C# L' ^$ ?0 L2 x6 H2 {3 S
#umenu #yzbox { width:142px;position:absolute; border:1px solid #ddd; background:#fff; top:60px; right:100px; padding:5px;z-index:1000;}$ ]  w# N* D2 k) a
#umenu #questionid { margin:-1px; }
+ H; ^7 {6 K2 V, N# |. P2 ~#umenu .selecttype { width:140px;border:1px solid #ddd; overflow:hidden;margin:5px 0;height:auto!important;}
) [6 Q, l7 G, c, ?9 {$ A6 X#umenu #yzbox input.txt {width:132px;margin:0px;}
" D: y: Y: i+ l# Tpct.sclub.com.tw#umenu .closea { color:#333; font-size:12px; float:right;display:inline-block;width:16px;}PCT 論壇5 k# l5 R% D) t- ~3 c# T
#umenu .submit {width:70px; border:#235994 1px solid;color:#fff;background:#06c;height:23px;}% `' B; ?1 H5 D$ S7 X# Q4 Q8 ?$ v, C! Q
#umenu .zd {margin-right:7px;}
" j, H* Q  }9 M6 G  cPCT 論壇#umenu .loginform label {display:inline!important;}PCT 論壇: W. h0 i# }! c4 x  @
#umenu .loginform {width:auto!important;height:auto!important;border-right:0px!important;padding:0px!important;margin:0px!important;}
1 S' q" _7 ?7 w( F8 N.lzc a {display:inline-block;border:#e6e6e6 1px solid;background:#eee;font-weight:700;margin:2px 5px 0 10px!important;height:21px;line-height:21px;padding:0px 10px;}
4 B/ m5 t, M$ p0 t8 r.yzwd {width:100px;display:inline-block;}PCT 論壇# N" a. f% b: x! |+ `
</style>
+ z" r+ }' Q& F; _5 o7 LPCT 論壇<script type="text/javascript">; G: v( w; `% C/ U+ c, N- I3 ~
function $(id){return document.getElementById(id);}
! [  d2 G8 \* f7 \pct.sclub.com.twfunction Sdiv(Aid) {if($(Aid) !=null){$(Aid).style.display = 'block'}}' e9 G; [! @# l  L. r: _7 S' d
function Cdiv(Bid) {if($(Bid) !=null){$(Bid).style.display = 'none'}}
/ C" X, ?% J8 T" u</script>
  a0 _! v* A% b8 C2 f! `$ W: I3 }<div id="tb_1" style="display:none">, J+ Y+ C' [1 F5 {" i( T
<div class="qqlogin left">
4 F# {4 J  ~& v. J<p><a href="/connect.php?mod=login&op=init&referer=index.php"><img src="http://images.5d6d.net/dz7/plugins/qqconnect/qq_login.gif" class="vm" alt="QQ登入" /></a></p># n) {$ ]- ?# `/ ]
<p class="hm xg1" style="padding-top: 2px;">只需一步，快速開始</p>
* x/ e+ J  N5 i# N3 D8 O: iPCT 論壇2 c; r2 U% X8 L9 ~. [( }0 L
</div>
( ]9 y7 E2 ~. O+ M* n1 t  L<div class="fastlogin left">
8 G. W+ _' P& J% ^3 @<form method="post" name="login" id="loginform" class="gateform"  action="/logging.php?action=login&loginsubmit=yes">PCT 論壇- t$ ?# q  ]  r3 B
<input type="hidden" name="formhash" value="a45a9ada" />5 i- v. S$ n9 O( T4 Y8 O3 _
<input type="hidden" name="referer" value="index.php" />
* j# j+ `8 N  @# {# {; Kpct.sclub.com.tw<div class="loginform nolabelform">
" z7 L+ L2 [; c) q$ ?* w: g8 `PCT 論壇<input type="hidden" name="loginfield" value="username" />PCT 論壇+ L" L3 O& x1 [; L! L9 T! s$ ?
<p>用戶名<input type="text" name="username" autocomplete="off" size="36" class="txt" tabindex="1" value="" /><span class="zd"><input type="checkbox" class="checkbox" name="cookietime" id="cookietime" tabindex="1" value="2592000"  /> <label for="cookietime">自動登入</label></span><a href="javascript:;" title="忘記密碼" class="fpw">忘記密碼</a></p><p>密碼<input type="password" id="password3" name="password"  onfocus="javascript:Sdiv('yzbox')"  size="36" class="txt" tabindex="1" /><span><button class="submit" type="submit" name="loginsubmit" value="true" tabindex="1">登入</button></span><span class="lzc"><a href="registerbbs.php" title="註冊帳號">馬上加入PCT會員</a></span></p>
' |" z( N% q% {: b; R; z<div id="yzbox" style="display:none;">
) S' I( Y- r5 K! R# y<p class="s_clear"><span class="left yzwd">驗證問答</span><a href="javascript:viod(0);" title="關閉" class="closea">X</a></p>
' j" V! ?5 H6 ^! C* Ppct.sclub.com.tw<div class="selecttype">' n7 T* v9 L9 s# L' @8 H
<select id="questionid" name="questionid">PCT 論壇! r) P$ l- t& t9 t
<option value="0">安全提問</option>PCT 論壇' t& e$ i) A# @( O3 N
<option value="1">母親的名子</option>
( G% }! L2 m3 i. W" _) I  c<option value="2">爺爺的名字</option>/ D- z3 f4 c- ^  b) T5 \. Y! |
<option value="3">父親出生的城市</option>6 N% f/ C6 L# q* }( E
<option value="4">您其中一位老師的名字</option>7 z1 [9 e% m' J, A! J
<option value="5">您個人電腦的型号</option>
7 ^  k' ~- X' p: _# dPCT 論壇<option value="6">您最喜歡的餐廳名稱</option>
( x: X+ }4 [3 a<option value="7">駕駛執照的最後四位数字</option>
  x) H* [& ^$ C3 y9 h# Z" L</select>
3 H5 U4 Z& ~1 B8 [9 Vpct.sclub.com.tw</div>5 u  T, [+ O/ v0 k6 l* p
<p><input type="text" name="answer" id="answer"  autocomplete="off" size="36" class="txt" tabindex="1" /></p>
6 u9 T# Q- F  \: k9 u</div>
- L3 j' {, A/ f: B! C- Q  K' A</div>pct.sclub.com.tw* H1 }; P+ Z6 ?! Y7 Q5 }# A
</form></div>
. a, z7 z* c" |1 i( T9 Q; Jpct.sclub.com.tw</div><script type="text/javascript">5 v# y/ {& ?5 ~0 `
if ($("umenu") != null ){PCT 論壇" e' o+ h9 d& S9 k$ x# _
if(discuz_uid == 0){$("umenu").innerHTML = $('tb_1').innerHTML;$('tb_1').style.display='none'};if (discuz_uid == 0 && $("logging") != null){$("umenu").innerHTML =""}}</script>