MyBB Community Forums

Full Version: Drop down menu in Header Block
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Pages: 1 2
ok. so i have a new theme. and i have tryed to have the drop down menu like VB in the welcome block.

but it doesnt seem to work.
i can show you an example : [Image: attachment.php?aid=10996]

i have used this in header_welcomeblock_member

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" align="center">
<tr>
<td class="trow1" width="100%"><navigation></td>
<td class="trow3" nowrap="nowrap" style="padding:6px; font-size:11px">
{$lang->welcome_back}<br />
{$lang->welcome_current_time}<br />
<a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a> {$lang->welcome_pms_usage}
</td>
</tr>
</table>
<!-- userbar -->

<table border="0" class="usrbar_tab" align="center" cellspacing="1">

&nbsp;&nbsp;&nbsp;&nbsp;<tr>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a
href="{$mybb->settings['bburl']}/usercp.php">UserCp</a></td>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a
href="{$mybb->settings['bburl']}/calendar.php">Calendar</a></td>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a
href="{$mybb->settings['bburl']}/memberlist.php">Memberlist</a></td>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a href="#"
id="search" onclick="return openMenu(this)"
class="popup_button">Search <img
src="images/vbx/popdown.gif"></a></td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a href="#"
id="usercp" onclick="return openMenu(this)"
class="popup_button">Quick Links <img
src="images/vbx/popdown.gif"></a></td>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="usrbar" align="center"><a
href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a></td>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

&nbsp;&nbsp;&nbsp;&nbsp;<tr>

</table> 

<!-- /userbar -->



<!-- user cp tools menu -->

<div class="popbase_usrbar" id="usercp-popup" style="display:none">

<table cellpadding="4" cellspacing="1" border="0" class="smalltext" width="150px">

<tr><td class="tcat">Quick Links</td></tr>

<tr><td class="myvb_pop" ><a
href="search.php?action=getnew"><font color="black">View New
Posts</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="misc.php?action=markread"><font color="black">Mark
Forums Read</a></td></tr></font>

<tr><td class="myvb_pop"><a href="#"
onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup',
'buddyList',350, 350);"><font
color="black">{$lang->welcome_open_buddy_list}</a></td></tr></font>

<tr><td class="myvb_pop" align="center"><a
href="{$mybb->settings['bburl']}/search.php?action=getdaily"><font
color="black">Today's
Posts</font></a></td></tr>

<tr><td class="tcat"><a href="usercp.php">User CP</a></td></tr>

<tr><td class="myvb_pop"><a
href="usercp.php?action=editsig"><font color="black">Change
Signature</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="usercp.php?action=avatar"><font color="black">Change
Avatar</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="usercp.php?action=profile"><font color="black">Edit
Profile</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="usercp.php?action=options"><font color="black">Edit
Options</a></td></tr></font>



<tr><td class="tcat">Miscellaneous</td></tr>

<tr><td class="myvb_pop"> <a
href="private.php"><font color="black">Private
Messages</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="usercp.php?action=subscriptions"><font
color="black">Subscribed
Threads</a></td></tr></font>

<tr><td class="myvb_pop"><a
href="member.php?action=profile&amp;uid={$mybb->user['uid']}"><font
color="black">View
Profile</a></td></tr></font>

<tr><td class="tfoot">&nbsp</td></tr>

</table>

</div>



<!-- header quick search form -->

<div class="popbase" id="search-popup" style="display:none">

<table cellpadding="4" cellspacing="1" border="0" class="smalltext">

&nbsp;&nbsp;&nbsp;&nbsp;<tr>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="tcat">Search</td>

&nbsp;&nbsp;&nbsp;&nbsp;</tr>

&nbsp;&nbsp;&nbsp;&nbsp;<tr>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="myvb_pop">

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<form method="post" action="$settings[bburl]/search.php">

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="hidden" name="action" value="do_search" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="hidden" name="postthread" value="1" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="hidden" name="forums" value="all" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="hidden" name="showresults" value="threads" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="text" name="keywords" value="" />

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="submit" class="button" name="submit" value="Find" />

</form>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>

&nbsp;&nbsp;&nbsp;&nbsp;</tr>

&nbsp;&nbsp;&nbsp;&nbsp;<tr>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<td class="myvb_pop"><a href="search.php">Advanced Search</a></td>

&nbsp;&nbsp;&nbsp;&nbsp;</tr>

</table>

</div>

<!-- / header quick search form -->

and well look at it on my site http://www.movie-247.net

please help me fix it.!
afraid guests will not see that skin/theme
OK. for those who cant see the problem here it is!


also you can log in with
User: mybb
Pass:tester

[Image: attachment.php?aid=11697]
How about trying this

<a onclick="change(1)" href="#">Quick Links</a>
<table border="0" class="usrbar_tab" align="center" cellspacing="1">
<tr style="display: none" id="1"><td class="usrbar" align="center"><a href="{$mybb->settings['bburl']}/usercp.php">UserCp</a><br />
<a href="{$mybb->settings['bburl']}/calendar.php">Calendar</a><br />
<a href="{$mybb->settings['bburl']}/memberlist.php">Memberlist</a></br />
<a href="#"id="search" onclick="return openMenu(this)"class="popup_button">Search <imgsrc="images/vbx/popdown.gif"></a></br />
<a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}">{$lang->welcome_logout}</a><br />
</td>
</tr>
</table>

add following jscript just above your code (or link to it)
<script type="text/javascript">
function change(id){
  ID = document.getElementById(id);
   if(ID.style.display == "")  ID.style.display = "none";
  else  ID.style.display = "";  }
</script>

obviously change to your requirements

hope that helps
it didnt work Confused
the above code I posted worked on perfectly on my forum so suggest you double check you didn't miss anything from my above code (unless the css classes you are using are causing the problem)
hmm. yea i tried it Sad but it doesnt work. all taht happens is the text "quick link" shows and when you click it nothing happens Sad



this is the code i use that shows the buttons on its own properly with no drop down menu. is there anyway t oedit that?
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder" align="center">
<tr>
<td class="trow1" width="100%"><navigation></td>
<td class="trow3" nowrap="nowrap" style="padding:6px; font-size:11px">
{$lang->welcome_back}<br />
{$lang->welcome_current_time}<br />
<a href="{$mybb->settings['bburl']}/private.php">{$lang->welcome_pms}</a> {$lang->welcome_pms_usage}
</td>
</tr>
</table>
<div align="center">
<table class="tborder" border="0" cellspacing="0" cellpadding="3" align="center" style="border-top-width:0px; font-size:11px">
<tr align="center" class="trow6">
<td class="welcome"><a href="{$mybb->settings['bburl']}/usercp.php"><b>{$lang->welcome_usercp}</b></a></td>
<td class="welcome"><a href="{$mybb->settings['bburl']}/modcp.php"><b>{$modcplink}</b></a></td>
<td class="welcome"><a href="{$mybb->settings['bburl']}/admincp.php"><b>{$admincplink}</b></a></td>
<td class="welcome"><a href="#" onclick="MyBB.popupWindow('{$mybb->settings['bburl']}/misc.php?action=buddypopup', 'buddyList', 200, 300);"><b>{$lang->welcome_open_buddy_list}</b></a></td>
<td class="welcome"><a href="{$mybb->settings['bburl']}/misc.php?action=help"><b>{$lang->toplinks_help}</b></a></td>
<td class="welcome"><a href="{$mybb->settings['bburl']}/calendar.php"><b>{$lang->toplinks_calendar}</b></a></td>
<td class="welcome"><a href="search.php?action=getnew"><b>{$lang->welcome_newposts}</b></a></td>
<td class="welcome"><a href="$settings[bburl]/search.php"><b>{$lang->toplinks_search}</b></a></td>
<td class="welcome"><a href="{$mybb->settings['bburl']}/member.php?action=logout&amp;logoutkey={$mybb->user['logoutkey']}"><b>{$lang->welcome_logout}</b></a></td>
</tr>
</table>
</div>
no idea about your code .. all i know is my code works

did you add the javascript code as well as the html code .... exactly as I posted ?
yep. i added it!

i added the javascript at the top and when it didnt work there i tried at the bottom
var current_menu = "";

function openMenu(element)
{
	var id = element.id;
	var popup = document.getElementById(id+"-popup");

	if(current_menu == id)
	{
		closeMenu(current_menu);
		return false;
	}
	else if(current_menu)
	{
		closeMenu(current_menu);
	}

	//  Set menu position
	elemOffsetTop = offsetTop(element);
	elemOffsetLeft = offsetLeft(element);
	popup.style.position = "absolute";
	popup.style.zIndex = 10;
	popup.style.top = (elemOffsetTop+element.offsetHeight-1)+"px";
	popup.style.left = (elemOffsetLeft)+"px";

	// Right align menu if it is going to be off screen
	if(popup.style.width)
	{
		menuWidth = parseInt(popup.style.width);
	}
	else
	{
		menuWidth = popup.offsetWidth;
	}
	if(elemOffsetLeft+menuWidth >= document.body.clientWidth)
	{
		popup.style.left = (elemOffsetLeft+element.offsetWidth-menuWidth-2)+"px";
		if(isIE)
		{
			popup.style.left = (parseInt(popup.style.left)-6)+"px";
		}
	}

	// Attach our listeners
	attachListener(popup, "mouseover", handleOverOut);
	attachListener(popup, "mouseout", handleOverOut);
	document.onclick = handleOverOut;
	
	popup.style.display = "block";

	current_menu = id;

	return false;
}

function closeMenu(id)
{
	if(!id && current_menu)
	{
		// If no id, assume current menu
		id = current_menu;
	}
	var element = document.getElementById(id);
	var popup = document.getElementById(id+"-popup");
	popup.style.display = "none";

	// Remove listeners
	removeListener(popup, "mouseout", handleOverOut);
	removeListener(popup, "mouseover", handleOverOut);
	document.onclick = "";

	current_menu = "";
}
function handleOverOut(event)
{
	if(typeof(event) != "undefined" && event.type == "mouseover")
	{
		document.onclick = "";
	}
	else
	{
		document.onclick = handleClick;
	}
}

function handleClick(element)
{
	closeMenu("");
}





_____________________________________________________________________________










this is the JS that the drop down menu is
i want to thank -Steve- and Labrocca

for helpping me with this issue. all i did was simple edit the Myvb template and added the JS links into the 'headerinclude' template

thanks for your help. and sorry for me being so stupid lol Toungue

[Image: guide2zu0.jpg]
but your js code was not the one i posted which is probably why it didn't work

all i know is that i used the exact same code and js on my forum that i posted above to test it and it worked (your script looks more complicated than the one i posted)

still .. as long as it now works all well and good
Pages: 1 2