[Code] Bảng đăng ký, đăng nhập, tìm kiếm, đăng xuất nhanh trượt xuống.

  • Móm Đặc Biệt

    Demo ảnh


    Tìm kiếm nhanh


    Đăng ký nhanh


    Đăng nhập nhanh


    Đăng xuất nhanh

    Hướng dẫn:

    ACP >> Display >> Colors >> CSS
    Cho code này vào cuối
    Code:
    /* Đăng nhập - đăng ký - tìm kiếm */
    .frameTop{display:none;padding:10px 0;display:none;color:#DDD;position:relative;width:100%;background:#035e8d}
    .frameTop .inputTop,.frameTop fieldset,.frameTop h2,.frameTop > div{width:100%;display:block;height:30px!important;line-height:28px;border:1px solid #DDD;max-width:600px;margin:10px auto;padding:0 10px!important}
    .frameTop fieldset{border:0;padding:0!important}
    #searchTop fieldset{position:relative;background:#FFF;padding:0 48px 0 0 !important}
    #searchTop .btn{position:absolute;right:1px;top:1px;background:url(//i56.servimg.com/u/f56/18/59/49/93/13848712.png) no-repeat center center transparent!important;border:0!important;width:28px;height:28px!important;text-indent:-9999px;background-size:40px 40px!important;padding:0!important}
    #searchTop .inputTop{border:0 none!important;margin:0}
    #outTop fieldset{text-align:center}
    #outTop input[name="confirm"]{background:#d15c00!important;border-color:#b85101!important}
    #outTop input[name="confirm"]:hover{background-color:#777!important;border-color:#666!important}
    .frameTop h2{border:0 none;text-align:center;margin-bottom:20px!important;font-weight:300}
    .frameTop > div{margin-top:0;height:auto!important;border:0}

    Cho code này vào chỗ muốn hiện, ví dụ như cuối overall_header
    Code:
    <!-- BEGIN switch_user_logged_out -->
    <li id="submit-menu" class="menu-text menu-text-small "><a href="/register">ĐĂNG KÝ</a></li>
    <li class="menu-text menu-text-small "><a href="/login">ĐĂNG NHẬP</a></li>
    <!-- END switch_user_logged_out -->

    <div id="searchTop" class="frameTop">
                            <form action="/search" method="get" class="frm-form" name="searchform" style="background:#035e8d">
                                <fieldset>
                                    <input placeholder="Vui lòng nhập nội cần tìm" type="search" tabindex="1" name="search_keywords" size="30" value="" class="inputTop" required/>
                                    <input type="submit" tabindex="2" class="btn" />
                                </fieldset>
                            </form>
                        </div>
                                <!-- BEGIN switch_user_logged_out -->
                        <div id="loginTop" class="frameTop">
                            <form action="/login" method="post" class="frm-form" name="form_login" style="background:#035e8d">
                                <input placeholder="Tên đăng nhập" type="text" tabindex="1" name="username" size="30" maxlength="50" value="" class="inputTop" required/>
                                <input placeholder="Mật khẩu" type="password" tabindex="2" name="password" size="30" maxlength="50" class="inputTop" required/>
                                <fieldset>
                                    <input type="hidden" name="redirect" value="" />
                                    <input type="submit" name="login" tabindex="3" value="Đăng nhập" class="button2" />&nbsp;&nbsp;
                                    <label>
                                        <input type="checkbox" name="autologin" id="autologin" tabindex="4" class="checkbox" checked="checked" />&nbsp; Ghi nhớ đăng nhập ?</label>
                                </fieldset>
                            </form>
                        </div>
                        <div id="regTop" class="frameTop">
                            <form action="/register?agreed=true&step=2" method="post" class="frm-form" name="form_register" style="background:#035e8d">
                                <input id="username_reg" placeholder="Tên đăng nhập" type="text" tabindex="1" name="username" size="30" maxlength="20" value="" class="inputTop" title="Tên tài khoản phải có ít nhất 4 ký tự" required/>
                                <input id="email" placeholder="Địa chỉ Email" name="email" tabindex="2" value="" size="30" maxlength="64" type="email" class="inputTop" required/>
                                <input placeholder="Mật khẩu" type="password" tabindex="3" name="password" size="30" maxlength="50" class="inputTop" title="Nên đặt mật khẩu có chữ và số để an toàn hơn cho tài khoản của bạn" required/>
                                <fieldset>
                                    <input type="submit" name="submit" tabindex="4" value="Đăng ký" class="button2" />&nbsp;&nbsp;
                                    <input class="button2" name="reset" tabindex="5" value="Xác lập lại" type="reset" />
                                </fieldset>
                            </form>
                        </div>
                                <!-- END switch_user_logged_out -->
                        <!-- BEGIN switch_user_logged_in -->
                        <div id="outTop" class="frameTop" style="overflow: hidden; display: none;">
                            <form action="{U_LOGIN_LOGOUT}" method="post" class="frm-form" style="background:#035e8d">
                                <h2>Bạn có thật sự muốn thoát ?</h2>
                                <fieldset>
                                    <input type="submit" name="confirm" value="Có">&nbsp;&nbsp;
                                    <input class="close" type="button" name="cancel" value="Không">
                                </fieldset>
                            </form>
                        </div>
                        <!-- END switch_user_logged_in -->

                        <script type="text/javascript">
                            //<![CDATA[
                            $(function() {
                                var b, p = location.pathname;
                                "/login" == p || "/register" == p ? ($("#regTop, #loginTop").remove(), $("#username_reg").attr({
                                    pattern: "^[^\\d\\.]([\\.\\w\\d]+){2,}",
                                    title: "Tên tài khoản phải có ít nhất 3 ký tự và bắt đầu bằng chữ cái hoặc gạch dưới. Chỉ được phép sử dụng chữ cái, số, dấu chấm và dấu gạch dưới"
                                }), $("#pass").attr({
                                    pattern: "^(?=.*\\d)(?=.*[a-zA-Z]).{6,}$",
                                    title: "Mật khẩu từ 6 ký tự trở lên, bao gồm chữ và số"
                                }), $("#email").attr("type", "email"), $("#email, :password, [name=username]").attr("required", "required")) : ($("a[href^='/login']:not('#logout')").attr({
                                    "data-href": "#loginTop",
                                    "class": "quickLink"
                                }), $("input[name='redirect']").val(p), $("#logout").attr({
                                    "data-href": "#outTop",
                                    "class": "quickLink"
                                }), $("a[href^='/register']").attr({
                                    "data-href": "#regTop",
                                    "class": "quickLink"
                                }));
                                $(".frameTop .close").click(function() {
                                    $(this).closest(".frameTop").stop().slideUp();
                                });
                                "/search" == p ? $("#searchTop").remove() : $("a[href='/search'],a[href='/search?tt=1']").attr({
                                    "data-href": "#searchTop",
                                    "class": "quickLink"
                                });
                                $(".quickLink, .close.topform").click(function(a) {
                                    a.preventDefault();
                                    $(document).scrollTop(0);
                                    a = $(this).data("href");
                                    a != b ? (b = a, $(".frameTop").stop().slideUp(), $(a).stop().slideDown()) : ($(a).stop().slideUp(), b = "")
                                })
                            }); //]]>
                        </script>

    Tags: #code #tuts

Thông tin tác giả
avatar
S-MOD
Bài viết :
285
Points :
592
Like :
157
Punbb
An toàn
Status :
Đành vậy thế thôi
Xem lý lịch thành viên http://vnraovat.forumvi.com/
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết