1 Bảng đăng nhập sử dụng fancybox2 20/4/2012, 4:08 pm
Founder
Admin
Chức năng:
Demo: http://www.fmvi.org/h107-login-fancybox
Hướng dẫn:
Bước 1: Cài đặt fancybox2. Click vào đây để xem hướng dẫn.
Bước 2: Thêm vào cuối overall_footer_begin, trước javascript fancybox2
ACP - Display - Templates - Ganeral - overall_footer_begin
Đặt javascript này vào cuối javascript fancybox2:
Nguồn: http://www.fmvi.vn
- Mở khung đăng nhập ngay tại trang đang xem.
- Sử dụng fancybox2 với hiệu ứng elastic.
- Không chuyển trang sau khi đăng nhập.
Demo: http://www.fmvi.org/h107-login-fancybox
Hướng dẫn:
Bước 1: Cài đặt fancybox2. Click vào đây để xem hướng dẫn.
Bước 2: Thêm vào cuối overall_footer_begin, trước javascript fancybox2
ACP - Display - Templates - Ganeral - overall_footer_begin
- Code:
<!-- BEGIN switch_user_logged_out -->
<style type="text/css">
.fancybox-inner {
overflow: hidden!important
}
#loginFancy {
width: 305px;
padding: 0pt ! important;
margin: -5px -5px -17px
}
#loginFancy .user_login_form {
text-align: left
}
#loginFancy p {
width:269px;
padding: 5px;
position: relative
}
#loginFancy .mainoption {
padding: 4px 2px! important;
border: 0;
font-style: normal!important;
font-weight: 500;
border-radius: 0;
margin-top: -5px;
}
#loginFancy .post {
position: absolute;
left: 80px;
width:90px
}
#loginFancy .Rlogin {
right:0;
position: absolute
}
</style>
<div style="display:none">
<div id="loginFancy">
<form action="/login" method="post" name="form_login">
<div class="user_login_form main-box center">
<p>
<label>
<span class="genmed" style="">Tài khoản :</span>
<input type="text" class="post" size="10" name="username" />
</label>
<label class="Rlogin">
<input type="checkbox" class="radio" name="autologin" checked="checked" />
<span class="gensmall">Ghi nhớ?</span>
</label>
</p>
<p>
<label>
<span class="genmed">Mật khẩu : </span>
<input type="password" class="post" size="10" name="password" />
</label>
<label class="Rlogin">
<input type="submit" class="mainoption" name="login" value="Đăng nhập" />
</label>
</p>
</div>
</form>
</div>
</div>
<!-- END switch_user_logged_out -->
Đặt javascript này vào cuối javascript fancybox2:
- Code:
$("a[href='/login']:not('.message a')").removeAttr("href").attr("href", "#loginFancy");
$("#loginFancy form").append('<input type="hidden" name="redirect" value="' + location.href + '" />');
$("a[href='#loginFancy']").fancybox({
fitToView: false,
width: 305,
minHeight: 63,
height: 63,
autoSize: false,
closeClick: false,
openEffect: 'elastic',
closeEffect: 'elastic'
});
Viết bởi baivong - www.fmvi.org
Nguồn: http://www.fmvi.vn