MyBB Community Forums

Full Version: Adding a modal login box to MyBB using jQuery
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
Doesn't work mate, it just shows me the entire box right at the index without clicking on it.
Then obviously you've done something wrong. Without a link to your site, it's kind of hard to diagnose.
@Euan T.
I want to use it as in the following attachments. how to apply? Big Grin
Can you post a screenshot of the outcome you wish to achieve rather than me having to download a .zip?
wait. I had a little problem with CSS. and maybe you better look at the attached file below.

your version:
[attachment=28702]

my version:
[attachment=28703]

(2013-02-26, 12:12 AM)Euan T. Wrote: [ -> ]Can you post a screenshot of the outcome you wish to achieve rather than me having to download a .zip?
perhaps, it is better if you download the file attachment. it would not hurt for you. Smile

because of the language barrier, I can not explain the details of this matter to you. hopefully with a file attachment images above can explain. Smile
Without seeing your website live so I could have a look at the HTML structure and CSS layout, there's very little I can do I'm afraid.
You can place another <div id="mask"></div> in the topmost part of your "header" template.
@Euan T. Big Grin
almost complete. However, I am having a little problem. that is, when I want to try to login, the link actually go to reset the password. Please help to improve the page. Toungue

[attachment=28715]

[attachment=28716]

This is my login script

<!-- login modal box -->
        <div style="padding: 100px 0 0 0;">


        <div id="login-box">
        <form method="post" action="{$mybb->settings['bburl']}/member.php">   
        <H2>Login @ {$mybb->settings['bbname']}</H2>
        <a href="{$mybb->settings['bburl']}/member.php?action=register" style="
    color: white;">{$lang->welcome_register}</a> | <a href="{$mybb->settings['bburl']}/member.php?action=lostpw" style="margin-left:5px;color: white;">Forgot password?</a>

        <br />
        <div id="login-box-name" style="margin-top:20px;">Username:</div>
            <div id="login-box-field" style="margin-top:20px;">
                <input name="text" value="" class="form-login" title="Username" size="30" maxlength="2048" name="username" id="login_username" />
            </div>
        <div id="login-box-name">Password:</div>
            <div id="login-box-field">
                <input type="password" value="" class="form-login" title="Password" size="30" maxlength="2048"  name="password" id="login_password" />
            </div>
        <br />
        <span class="login-box-options">
            <input type="checkbox" name="1" value="1"> Remember Me </span>
        <br />
        <br />
        <input type="submit" value="Login" name="submit" class="button" width="103" height="42" style="margin-left:90px;" />
        
            <input type="hidden" value="do_login" name="action" />
            <input type="hidden" value="" name="url" />
        </form>

        </div>
        </div>
<!-- login modal box -->

</div>


I know that there is an error from the script above. but i am confused where lies the fault. Big Grin

sorry if my language is wrong.

forget it. I've managed to fix it. Toungue

thanks to Euan T. Big Grin
Very nice. Thanks,
How can I insert "Forgot password" button? your code in 1st post doesn't show "Forgot password"

Solved!

There is problem with mobiles view. I've tried in Android with Dolphin browser. login box position is not correct and it doesn't zoom!
so its working on Chrome but acts stupid in Opera and Firefox. It won't mask and it just expands the header rather than floating over the page modally
Pages: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26