Topic: dropdown menu

[wdm2005]

im looking for a decent drop down menu for my site i have looked on dynamic drive but cant find one i like does anybody no any whre else i can get one

[brianjw]

I kind of like the one's over at Milonic.
http://www.milonic.com/

[bigguy]

That looks like a cool site. I will have to check that out, thanks.

[wdm2005]

thanks brian would i be able to swap both of my menus on my site for this if so how would i go about hidding certain link ie the admin button
 
and also show login and reg to guest but not members
 
and logout to members i know how to do it using php
 
but this is usiong jscript to put the link in and i dont no how
 
thanks wdm

[butchas]

Here is some info on drop downs without Java:  http://www.alistapart.com/articles/dropdowns/
 

[brianjw]

wdm2005, it is possible to switch the current SMF menu with one of these. Although, it is past my knowledge.

[wdm2005]

wdm2005, it is possible to switch the current SMF menu with one of these. Although, it is past my knowledge.

 
lol yep its past mine too lol thats y i asked :D

[cecilgoode]

Find out where the menu is that you want to incorperate and play with it a little... I'm sure your going to need to call an external .js/images file so you'll need to do that as well...

[Smoky]

ok perhaps we can get BigGuy to do a walk thru on this..

say for example that you are trying to replace the "main menu naviagation" for the site, and you are modifying the "default/core" theme.. exactly how on using "this" script, where could the changes be made, and why?? lol.. im a bit lost on this..

do i remove all refferences of the "orginal" menu tabs and the "show in array()"? 

[cecilgoode]

BigGuy, what do you think?

[bigguy]

I just got home. If you give me til tomorrow I will see what I can do about a mod...or at least posting the code changes of what I did.

[Smoky]

that's good BigGuy.. I havent had time to look at the code or what changes to make.. 

[TreetopClimber]

This is a good drop down menu from dynamic drive.
heres the code for the style.css

:

/****
    These are for the dropdown menus.
****/

a.subPro-link:link, a.subPro-link:visited, a.subPro-link:active { color: #005177; text-decoration: none; border: 0; display: block; background-color: #d8d8d7; text-align: left; padding-left: 5px; line-height: 20px; vertical-align: middle; }

a.subPro-link:hover { color: #003366; text-decoration: none; border: 0; background-color: #d1edff; }

a.subMenu-link:link, a.subMenu-link:visited, a.subMenu-link:active { color: #005177; text-decoration: none; border: 0; display: block; background-color: #d8d8d7; text-align: left; padding-left: 5px; line-height: 20px; vertical-align: middle; }

a.subMenu-link:hover { color: #003366; text-decoration: none; border: 0; background-color: #d1edff; }
heres what your index.template.php would look like.
Place this in your function template_main_above() like this.

:

    <script language="JavaScript" type="text/javascript" src="', $settings['default_theme_url'], '/script.js?fin11"></script>
    <script language="javascript" type="text/javascript" src="', $settings['theme_url'], '/dropdown.js"></script> then near the bottom where it calls for the actual menu it would look like this.

:

// Show the menu up top.  Something like [home] [help] [profile] [logout]...
function template_menu()
{
    global $context, $settings, $options, $scripturl, $txt;

    // Show the [home] and [help] buttons.
  echo '
<a href="', $scripturl, '">' .$txt[103] . '</a>', $context['menu_separator'], '
<a href="', $scripturl, '?action=help">' . $txt[119] . '</a>', $context['menu_separator'];

/* <!-- TPortal Section  -->
if($settings['TPortal_front_type']!='boardindex')
    // Show the [forum] button.
    echo '
<a href="', $scripturl, '?action=forum">'.$txt['tp-forum'].'</a>', $context['menu_separator'];*//*

  // How about the [downloads] button?
    if ($context['user']['is_logged'])
echo '
<a href="', $scripturl, '#dwnldlinks" onmouseover="return overlay(this, \'dwnldlinks\',\'bottom\')">' . $txt[dwnldlinks] . '&nbsp;</a>
                <!--Do not remove outer most DIV tag with id="downldlinks"-->
<DIV id="dwnldlinks" style="position:absolute; border: 2px solid #3d3d3d; background-color: white; width: 150px; padding: 2px; display:none">';

   if ($context['user']['is_logged'])
        echo '
<a class="subDwn-link" href="', $scripturl, '?action=tpmod;dl=upload">' . $txt[tp-dlupload] . '</a>';

echo '
<div align="left"><a class="subDwn-link" href="#" onmouseout="overlayclose(\'downldlinks\'); return false"></a></div>
</DIV>';
<!-- End TPortal Section  --> */
   // How about the [admin info] button?
    if ($context['allow_admin'])
echo '
<a href="', $scripturl, '#adminlinks" onmouseover="return overlay(this, \'adminlinks\',\'bottom\')">' . $txt[adminlinks] . '&nbsp;</a>
                <!--Do not remove outer most DIV tag with id="adminlinks"-->
<DIV id="adminlinks" style="position:absolute; border: 2px solid #3d3d3d; background-color: white; width: 150px; padding: 2px; display:none">';
        // Is the user allowed to administrate at all? ([admin])
    if ($context['allow_admin'])
        echo '
<a class="subPro-link" href="', $scripturl, '?action=admin">Admin Main</a>
<a class="subPro-link" href="', $scripturl, '?action=news">' . $txt[102] . '</a>
<a class="subPro-link" href="', $scripturl, '?action=packages">Packages</a>
<a class="subPro-link" href="', $scripturl, '?action=manageboards">Boards</a>
<a class="subPro-link" href="', $scripturl, '?action=postsettings">Post & Topics</a>
<a class="subPro-link" href="#" onmouseout="overlayclose(\'adminlinks\'); return false"></a>
</DIV>', $context['menu_separator'];
// How about the [search] button?
    if ($context['user']['is_logged'])
        echo '
<a href="', $scripturl, '?action=search">' . $txt[182] . '</a>', $context['menu_separator'];

// How about the [user info] button?
    if ($context['user']['is_logged'])
echo '
<a href="', $scripturl, '#userlinks" onmouseover="return overlay(this, \'userlinks\',\'bottom\')">' . $txt[userlinks] . '&nbsp;</a>
                <!--Do not remove outer most DIV tag with id="userlinks"-->
<DIV id="userlinks" style="position:absolute; border: 2px solid #3d3d3d; background-color: white; width: 150px; padding: 2px; display:none">';
    // Edit Profile... [profile]
    if ($context['allow_edit_profile'])
        echo '

<a class="subMenu-link" href="', $scripturl, '?action=profile">' . $txt[79] . ' Main</a>
<a class="subMenu-link" href="', $scripturl, '?action=profile;u=', $context['user']['id'], ';sa=forumProfile">Forum Info</a>
<a class="subMenu-link" href="', $scripturl, '?action=profile;u=', $context['user']['id'], ';sa=account">Account Settings</a>
<a class="subMenu-link" href="', $scripturl, '?action=profile;u=', $context['user']['id'], ';sa=theme">Look & Layout</a>
<a class="subMenu-link" href="', $scripturl, '?action=pm">' . $txt[pm_short] . '</a>
<a class="subMenu-link" href="#" onmouseout="overlayclose(\'userlinks\'); return true"></a>
</DIV>', $context['menu_separator'];

  // The [calendar]!
    if ($context['allow_calendar'])
        echo '
<a href="', $scripturl, '?action=calendar">' . $txt['calendar24'] . '</a>', $context['menu_separator'];
 

    // If the user is a guest, show [login] and [register] buttons.
    if ($context['user']['is_guest'])
    {
        echo '
<a href="', $scripturl, '?action=login">' . $txt[34] . '</a>', $context['menu_separator'], '
<a href="', $scripturl, '?action=register">' . $txt[97] . '</a>';
    }
    // Otherwise, they might want to [logout]...
    else
        echo '
<a href="', $scripturl, '?action=logout;sesc=', $context['session_id'], '">' . $txt[108] . '</a>';   
}
Then un zip this dropdown.js file and place it in your themes root. File is attached.

[Smoky]

Thanks TT.. will try that out..  if i cant get it to go will post back!! 

[wdm2005]

how can this be done with smf 2.0