精仿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;}
0 e5 ^2 p1 I* j. F#umenu .checkbox {vertical-align:middle; margin:0px 0px 1px 0px;}pct.sclub.com.tw  K  H' r% n7 ~8 c
#umenu .qqlogin {border-right:1px solid #ddd; margin-right:10px; padding-right:5px;text-align:center;margin-top:5px;}PCT 論壇' p: _) Y' b1 |: C
#umenu {z-index:888;}
3 g% k* l; H5 S) n1 I1 L4 lpct.sclub.com.tw#umenu #yzbox { width:142px;position:absolute; border:1px solid #ddd; background:#fff; top:60px; right:100px; padding:5px;z-index:1000;}
& ]* z# q# \! w8 c0 Q0 xPCT 論壇#umenu #questionid { margin:-1px; }
$ j* k  Q+ L3 t. D" {7 @pct.sclub.com.tw#umenu .selecttype { width:140px;border:1px solid #ddd; overflow:hidden;margin:5px 0;height:auto!important;}) Q7 u+ \% N, B
#umenu #yzbox input.txt {width:132px;margin:0px;}
: s$ g7 F$ D/ C  ]+ v6 ~#umenu .closea { color:#333; font-size:12px; float:right;display:inline-block;width:16px;}! t4 X, d5 e/ p& L" c. k/ O
#umenu .submit {width:70px; border:#235994 1px solid;color:#fff;background:#06c;height:23px;}
- M! x5 o3 J" X+ u2 m6 p! S) }#umenu .zd {margin-right:7px;}4 s: O( |; N, g
#umenu .loginform label {display:inline!important;}
( n/ g. R# S% C: j4 ^" I4 z' I8 U#umenu .loginform {width:auto!important;height:auto!important;border-right:0px!important;padding:0px!important;margin:0px!important;}' G$ ~* f3 i; a
.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;}pct.sclub.com.tw  y0 f  Z1 P3 R- i# o' _0 _2 f
.yzwd {width:100px;display:inline-block;}- r: r" Q# Y, q1 K+ k
</style>PCT 論壇( ~- e( [& J: P
<script type="text/javascript">
  `$ o' s6 m4 E  \3 P( Dfunction $(id){return document.getElementById(id);}# p3 Y' h8 c# r9 y4 G& T
function Sdiv(Aid) {if($(Aid) !=null){$(Aid).style.display = 'block'}}
0 \0 I2 P, C2 [pct.sclub.com.twfunction Cdiv(Bid) {if($(Bid) !=null){$(Bid).style.display = 'none'}}
4 S6 t, x& q$ m4 D  _$ Y0 r</script>8 W/ {1 E) U: o% @
<div id="tb_1" style="display:none">
  {+ D# x! z/ J7 n2 s<div class="qqlogin left">6 C+ Y7 \+ {  A9 a6 n7 J' z
<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>
- X3 D1 i( |) z0 C<p class="hm xg1" style="padding-top: 2px;">只需一步，快速開始</p>
/ e1 d8 L3 `0 [! k' r/ y+ K* a
) g1 r. ~; T7 IPCT 論壇</div>+ m. O, u4 V7 t4 j5 \! E
<div class="fastlogin left">pct.sclub.com.tw* _! p5 C# _1 f, X) C, C
<form method="post" name="login" id="loginform" class="gateform"  action="/logging.php?action=login&loginsubmit=yes">PCT 論壇* K, a7 S% o) e  R# q8 d1 K
<input type="hidden" name="formhash" value="a45a9ada" />/ q3 K$ P) N: b- q' P" Z' X
<input type="hidden" name="referer" value="index.php" />5 I4 q6 h- i9 t' ?% P" X9 V) G
<div class="loginform nolabelform">
+ e( h3 t% Y' ^/ b<input type="hidden" name="loginfield" value="username" />- x, \" Z) H" t# A2 a" u
<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>pct.sclub.com.tw3 l7 h) k1 s' F4 N2 v/ ]! Q2 K
<div id="yzbox" style="display:none;">7 B5 M" z: D% k+ m: Y
<p class="s_clear"><span class="left yzwd">驗證問答</span><a href="javascript:viod(0);" title="關閉" class="closea">X</a></p>$ P3 i8 A+ h" [- R
<div class="selecttype">
6 N) ^* ?7 x: R2 TPCT 論壇<select id="questionid" name="questionid">! ~  [4 ^/ c6 D! E& J$ o
<option value="0">安全提問</option>
) Z, R3 _8 k; w2 v/ x$ k# }0 l<option value="1">母親的名子</option>pct.sclub.com.tw$ h  R9 F- Z2 t1 g
<option value="2">爺爺的名字</option>PCT 論壇& T6 n6 ~% @) O
<option value="3">父親出生的城市</option>
- U* H8 d# Z, N6 O<option value="4">您其中一位老師的名字</option>
' v, X6 A: p$ A, [# R, B' o<option value="5">您個人電腦的型号</option>
* H' J4 J/ X  e% j$ P8 P<option value="6">您最喜歡的餐廳名稱</option>" |" b( r- c! v* P" {2 p, P/ o) t
<option value="7">駕駛執照的最後四位数字</option>
$ W+ h& u4 K4 j. `3 ^) OPCT 論壇</select>PCT 論壇4 P8 d0 r% i6 Y( }
</div>
- g& `! ~: s& G! N8 hPCT 論壇<p><input type="text" name="answer" id="answer"  autocomplete="off" size="36" class="txt" tabindex="1" /></p>7 E4 _6 |4 V0 U! m
</div>
  p; C! i1 ?3 v9 e</div>$ t" B+ Y+ y% A' j, d1 E" b1 [
</form></div>4 j1 e' s& ?: r* I3 L/ Y* s( c1 [
</div><script type="text/javascript">
4 F4 a; b. G( g. a( Z3 QPCT 論壇if ($("umenu") != null ){1 `  Z7 `$ v; \7 a
if(discuz_uid == 0){$("umenu").innerHTML = $('tb_1').innerHTML;$('tb_1').style.display='none'};if (discuz_uid == 0 && $("logging") != null){$("umenu").innerHTML =""}}</script>