MyBB Community Forums

Exactly what the title sounds like — when I try to log in from the index of my page, the login gets stuck underneath the navigation bar if the login button is clicked at a certain position. See below for what i mean.



I would rather it show on top, not behind it. I realize something has gone wrong where the navigation bar is registering as a fixed sticky even after login button is pushed. I want to find a way to have the login button register when it's been clicked and make the navigation bar turn into a static position instead of sticky fixed. I can't figure out where to insert the onclick function though.

Here's a snippet of the template header_welcomeblock_guest where I think I would need to put some kind of onclick function that turns the navigation bar to static.

Quote:<!-- Continuation of div(class="upper") as opened in the header template -->
<span class="welcome">{$lang->welcome_guest} <a href="{$mybb->settings['bburl']}/member.php?action=login" onclick="$('#quick_login').modal({ fadeDuration: 250, keepelement: true, zIndex: (typeof modal_zindex !== 'undefined' ? modal_zindex : 9999) }); return false;" class="login">{$lang->welcome_login}</a> <a href="{$mybb->settings['bburl']}/member.php?action=register" class="register">{$lang->welcome_register}</a></span>
</div>
</div>
<div class="modal" id="quick_login" style="display: none;">
<form method="post" action="{$mybb->settings['bburl']}/member.php">
<input name="action" type="hidden" value="do_login" />
<input name="url" type="hidden" value="" />
<input name="quick_login" type="hidden" value="1" />
<input name="my_post_key" type="hidden" value="{$mybb->post_code}" />
<table width="100%" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" border="0" class="tborder">
<tr>
<td class="thead" colspan="2"><strong>{$lang->login}</strong></td>
</tr>
{$loginform}
</table>
</form>
</div>
<script type="text/javascript">
$("#quick_login input[name='url']").val($(location).attr('href'));
</script>

And here's a link to the page this is occurring on.
click!

just lower down z-index of sticky class

main.css

Find:

.sticky {
	position: sticky;
	position: -webkit-sticky;
	top: 0;
	z-index: 99999;
}

Replace with:

.sticky {
	position: sticky;
	position: -webkit-sticky;
	top: 0;
	z-index: 9999;
}

BR
Mujeeb