Go Back   vb.org Archive > vBulletin 3 Discussion > vB3 Programming Discussions

Reply
 
Thread Tools Display Modes
  #11  
Old 06-28-2006, 02:19 AM
Code Monkey's Avatar
Code Monkey Code Monkey is offline
 
Join Date: May 2004
Posts: 1,080
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Here is a little tutorial for you, hope that's what you're looking for.


To make a popup menu like those used in vBulletin using the actual vBulletin code is quite simple.

You only need to do two things beyond what you would normally do to make the menu itself. The actual menu has no additional formatting. So you can add existing or dynamic menus to a popup.

First you make the link that will be clicked to open the popup menu. This can be placed anywhere on a vBulletin page that contains the menu javascript. If the following is not on the page (It's most likely there if the navbar is) you can add it.

Code:
<script type="text/javascript" src="clientscript/vbulletin_menu.js"></script>
For the link code, you need a container. I use a table column below but you can use a div and most likely a span as well. Next you need to create a unique identifier for your menu. Below I use "my_made_up_menu_name", but it can be anything as long as it's unique to that page. You will use this as the id value for the container of the link.

Next you need to give the container the class value of "vbmenu_control". Unlike the id, this is a static choice and must be used as is.

Next you create the clickable link itself. You assign the href attribute with the value of "#unique_menu_id" which in the sample below would be "#my_made_up_menu_name". Don't forget to precede it with the # symbol.

Then give the link a display value to click. This can be whatever is appropriate for the menu. Such as "Quick Links" in the vBulletin navbar.

Finally, add the javascript code with the vbmenu_register function with the unique menu id. In the sample it is vbmenu_register("my_made_up_menu_name");. That covers the link. Simple eh?

HTML Code:
<!--The actual link code that will be clicked to open the pop up menu-->
<td id="my_made_up_menu_name"
class="vbmenu_control"
align="left">
<a href="#my_made_up_menu_name">Link Name</a> <script type="text/javascript">
//<![CDATA[
vbmenu_register("my_made_up_menu_name");
//]]>
</script>
</td>
The menu wrapper itself is quite easy. Below I use a div which you can put anything in. Such as a table or a list, or even another div or a picture of your puppy. It's all up to you.

Here is the tricky part that can get overlooked. This containers id is the unique id of the link above but you add "_menu" to the end of it. So in the example below it is "my_made_up_menu_name_menu".

Next you make the class attribute have a value of "vbmenu_popup".

And last but not least, you assign the style property of "display:none".


And your done.

HTML Code:
<!--Hidden menu code placed on the page anywhere below the actual link to open it-->
<div id="my_made_up_menu_name_menu"
class="vbmenu_popup"
style="display:none">
<!--Put your table or list code here-->
</div>
There is lot's of javascript out there to make these popup menu's. Some better and some worse than what is included in vBulletin. I myself have used overlib in many web applications. However, the proper thing to do when adding features to vBulletin or any other target software, is to add features without adding code, if possible. So if you can get the desired result using the code that is already there then that is the proper way to go about it bloat free.

The above tutorial copyright vbmodder.com
Reply With Quote
  #12  
Old 06-28-2006, 06:03 AM
Alan @ CIT Alan @ CIT is offline
 
Join Date: Nov 2004
Location: South UK
Posts: 625
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Many thanks for the tutorial, but have you any idea how to add sub-menus to the existing vbmenu class? That was my inital problem

ie, user clicks to display the drop down menu, move to one of the options (one with a little right arrow on it), clicks again and a sub-menu appears.

Thanks,
Alan.
Reply With Quote
  #13  
Old 06-28-2006, 09:17 AM
Zachery's Avatar
Zachery Zachery is offline
 
Join Date: Jul 2002
Location: Ontario, Canada
Posts: 11,440
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

AFAIK sub-menus are not possible.
Reply With Quote
  #14  
Old 06-28-2006, 09:32 AM
Alan @ CIT Alan @ CIT is offline
 
Join Date: Nov 2004
Location: South UK
Posts: 625
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hence my original post asking if anyone knew how I could extend the existing vbmenu class to add support for sub-menus

Thanks to everyone for their help, but I've scrapped the hack that needed the sub-menus for now, so not to worry

Thanks,
Alan.
Reply With Quote
  #15  
Old 06-28-2006, 10:00 AM
K1ng0e K1ng0e is offline
 
Join Date: May 2006
Location: Fr
Posts: 10
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Hey Alan !
You want to do a sub-menu like the sub-menu of the navbar (search or quicklink for example?)
Reply With Quote
  #16  
Old 06-28-2006, 12:08 PM
Trana Trana is offline
 
Join Date: Apr 2005
Posts: 604
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Alan,

I sent you a PM about the sub menus that I have running on my site. I don't use the VB version of the popups but I have embedded the jscript in the navbar template and it works well. Please see my PM.

Quote:
Originally Posted by Zachery
AFAIK sub-menus are not possible.
You can do this with a third party jscript tool like Infinite Menus.
Reply With Quote
  #17  
Old 06-28-2006, 12:59 PM
Code Monkey's Avatar
Code Monkey Code Monkey is offline
 
Join Date: May 2004
Posts: 1,080
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Alan @ CIT
Many thanks for the tutorial, but have you any idea how to add sub-menus to the existing vbmenu class? That was my inital problem

ie, user clicks to display the drop down menu, move to one of the options (one with a little right arrow on it), clicks again and a sub-menu appears.

Thanks,
Alan.
Just repeat the process with more unique id's within the menu items.
Reply With Quote
  #18  
Old 06-28-2006, 01:14 PM
Alan @ CIT Alan @ CIT is offline
 
Join Date: Nov 2004
Location: South UK
Posts: 625
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Making a menu within a menu item would make it dropdown though, rather than appear at the side of the existing menu entry?

I'll give it a try tonight and see how it goes.

Thanks,
Alan.
Reply With Quote
  #19  
Old 06-28-2006, 02:13 PM
Trana Trana is offline
 
Join Date: Apr 2005
Posts: 604
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

Quote:
Originally Posted by Alan @ CIT
Making a menu within a menu item would make it dropdown though, rather than appear at the side of the existing menu entry?

I'll give it a try tonight and see how it goes.

Thanks,
Alan.
It doesn't work, there is no logic in the jscript to handle a menu inside of a menu. See my post on .com about this. The only solution I have found is via an entirely new jscript.

If anyone has a better solution I would love to hear it!
Reply With Quote
  #20  
Old 06-28-2006, 05:03 PM
K1ng0e K1ng0e is offline
 
Join Date: May 2006
Location: Fr
Posts: 10
Благодарил(а): 0 раз(а)
Поблагодарили: 0 раз(а) в 0 сообщениях
Default

@Trana: Can you give me the link please =) ?
Reply With Quote
Reply

Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 11:26 AM.


Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2024, vBulletin Solutions Inc.
X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.05393 seconds
  • Memory Usage 2,258KB
  • Queries Executed 11 (?)
More Information
Template Usage:
  • (1)SHOWTHREAD
  • (1)ad_footer_end
  • (1)ad_footer_start
  • (1)ad_header_end
  • (1)ad_header_logo
  • (1)ad_navbar_below
  • (1)ad_showthread_beforeqr
  • (1)ad_showthread_firstpost
  • (1)ad_showthread_firstpost_sig
  • (1)ad_showthread_firstpost_start
  • (1)bbcode_code
  • (2)bbcode_html
  • (3)bbcode_quote
  • (1)footer
  • (1)forumjump
  • (1)forumrules
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (1)navbar
  • (3)navbar_link
  • (120)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (2)pagenav_pagelink
  • (10)post_thanks_box
  • (10)post_thanks_button
  • (1)post_thanks_javascript
  • (1)post_thanks_navbar_search
  • (10)post_thanks_postbit_info
  • (10)postbit
  • (10)postbit_onlinestatus
  • (10)postbit_wrapper
  • (1)spacer_close
  • (1)spacer_open
  • (1)tagbit_wrapper 

Phrase Groups Available:
  • global
  • inlinemod
  • postbit
  • posting
  • reputationlevel
  • showthread
Included Files:
  • ./showthread.php
  • ./global.php
  • ./includes/init.php
  • ./includes/class_core.php
  • ./includes/config.php
  • ./includes/functions.php
  • ./includes/class_hook.php
  • ./includes/modsystem_functions.php
  • ./includes/functions_bigthree.php
  • ./includes/class_postbit.php
  • ./includes/class_bbcode.php
  • ./includes/functions_reputation.php
  • ./includes/functions_post_thanks.php 

Hooks Called:
  • init_startup
  • init_startup_session_setup_start
  • init_startup_session_setup_complete
  • cache_permissions
  • fetch_threadinfo_query
  • fetch_threadinfo
  • fetch_foruminfo
  • style_fetch
  • cache_templates
  • global_start
  • parse_templates
  • global_setup_complete
  • showthread_start
  • showthread_getinfo
  • forumjump
  • showthread_post_start
  • showthread_query_postids
  • showthread_query
  • bbcode_fetch_tags
  • bbcode_create
  • showthread_postbit_create
  • postbit_factory
  • postbit_display_start
  • post_thanks_function_post_thanks_off_start
  • post_thanks_function_post_thanks_off_end
  • post_thanks_function_fetch_thanks_start
  • post_thanks_function_fetch_thanks_end
  • post_thanks_function_thanked_already_start
  • post_thanks_function_thanked_already_end
  • fetch_musername
  • postbit_imicons
  • bbcode_parse_start
  • bbcode_parse_complete_precache
  • bbcode_parse_complete
  • postbit_display_complete
  • post_thanks_function_can_thank_this_post_start
  • pagenav_page
  • pagenav_complete
  • tag_fetchbit_complete
  • forumrules
  • navbits
  • navbits_complete
  • showthread_complete