Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 6 of 6
  1. #1
    Junior Member MichaelRoe's Avatar
    Join Date
    May 2012
    Location
    Brisbane, Australia :D
    Posts
    12
    Member #
    31866
    Liked
    1 times
    Ok, so since it seems that this forum is such a great place to get help with scripting, and hopefully I could be a regular user here, I'm going to start coming here to get solutions to my noob problems

    Anyway, I'm having trouble with drop down menus.

    I want something similar to the 'User Controls' bar we have here, where you can put your mouse over a button and it will come up with a div where I can store even more buttons. However, instead of having this happen on the event of the mouse going over the button, I would like it to happen when the mouse clicks on the button.

    Does anyone have a code for this?

  2.  

  3. #2
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  4. #3
    Junior Member MichaelRoe's Avatar
    Join Date
    May 2012
    Location
    Brisbane, Australia :D
    Posts
    12
    Member #
    31866
    Liked
    1 times
    Thanks

    Looks like a good exampe

    I'm getting the code now

  5. #4
    Member christopher_b's Avatar
    Join Date
    Aug 2011
    Location
    Pretoria, South Africa
    Posts
    69
    Member #
    29042
    Liked
    7 times
    the best way is to use jquery for events to happen, and to make the event happen smoothly.
    For example.

    Code:
    $("a.button").click(function(){
        $(div.show).show(200);
    });
    What that code does is, when you click on a.button the div.show will show with a nice slide effect, that's what the 200 is for...or you can use fadeIn instead of show..

    To make the div dissapear when you no longer want to see it...you can do something like this.

    Code:
    $("a.button").click(function(){
        $(div.show).show(200);
    
        $("div.show").mouseout(function(){
            $(div.show).hide(200);
        });
    });
    How much do you know about html and javascript?

  6. #5
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    The only problem with your solution is that people with JS off have no navigation whatsoever. Usually I don't pander to that crowd, but basic site functions should work without JS. Perhaps a fallback? A CSS-based solution wrapped in a <noscript>?
    AlphaMare likes this.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  7. #6
    Member christopher_b's Avatar
    Join Date
    Aug 2011
    Location
    Pretoria, South Africa
    Posts
    69
    Member #
    29042
    Liked
    7 times
    Good point Ronald, a 'JavaScript off' detection would be needed here. to determine what should be used.


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 01:26 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com