Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 13 of 13
  1. #1
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Drop down frames

    Is it possible to make a drop down frame??

    I have seen many places where it is possible to make a drop down menu, or a mouseover image.

    The website under construction is here:

    http://the5thplatoon.servegame.com/#

    is it possible to have a image in one corner, and on mouseover a display will dropdown. Not a menu or an Image, but a teampspeak display or Table.

    thanks

  • #2
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    A real frame, an iframe, or a div?
    Not sure what you want.

    Probably, sure.
    Explain more what you're going for.

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #3
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #4
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    a div would do i think, just so i can put some things, as long as i can put a table in there it'll be ok.


    i do not want to put a menu in it

  • #5
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    *bump*

    plz help

  • #6
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    If you want help, you need to be a LOT more descriptive about what you want and why you can't just modify the menu code to do it.

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #7
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    ok

    hmm, i would a small button or image at the top of the screen.

    when u click on it it will open a box containing, hmmm, maybe links, or images.

    like the boxes on this website:

    http://www.aaserveradmins.com/forums...php?act=portal

    but instead of a small button, the whole top bar would be clickable

    i tried to google javascript toggle category, but not much help.
    Last edited by fatrat; 10-07-2005 at 04:09 PM.

  • #8
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    You make a button or an image.
    You make your div with the stuff you want to show. Set its visibility to hidden and display to none.
    In the onClick of the button/image, you set the div style visibility to visible and display to inline or block (usually block) as appropriate.

    If you want it to move, you use absolute positioning and set top/left incrementally to make it look "animated".

    You can find examples of this in, of all things, code for menus.

    If you want a simple toggle example, mail me. When I get home tonite I'll send you the same thing I sent someone who asked me nearly this exact thing last night.

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #9
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thank you very much for that example, i modded it and u can see the result:

    http://5thplatoon.aowc.net

    This is not the website I am gonna use it on, but just there to test it.

    When I changed the radios to an image the box wouldnt stay open. It shut after a split second. I replaced both radios with 1 image and set the value to yes.

    Anyway thanks for your help, it was excellent.

    No I can see how the code works I can give you a better description to improve it, if u dont mind ;-)

    I would like there to be images instead of radios or customized buttons. As long as I can make some cool looking button instead of those radios. Sorry I couldnt get that to work, I dont really know any coding, but I'm learning.

    Could I have a a list of options instead of just 2, like display A, display B, display C, Display none. Each image/button would display a different table, you could only display 1 of the tables at a time. Each time you clicked one of the options it would close one and open the other.

    edit: maybe its easiest just to use radio buttons with an image next to them. in firefox the <marquee> doesnt scroll until u mousevoer y?

    Is this possible, thanks very much.



    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    function toggle(e, theId)
    {
    if (e.value == "yes")
    {
    document.getElementById(theId).style.visibility = "visible";
    document.getElementById(theId).style.display = "block";
    }
    else
    {
    document.getElementById(theId).style.visibility = "hidden";
    document.getElementById(theId).style.display = "none";
    }
    }
    </script>




    <form name="form1" method="get" action="">
    <div id="insuranceDiv">
    <p>
    <input name="insurance" type="radio" value="yes" onClick="toggle(this,'insuranceDiv_child')">
    <img align=center valign=center src=http://5thplatoon.aowc.net/user/33521/images/tracker.gif>
    <br>
    <input type="radio" name="insurance" value="no" onClick="toggle(this,'insuranceDiv_child')">
    <font size=1>None</font>
    </p>
    <div id="insuranceDiv_child" style="visibility:hidden;display:none;">

    <MARQUEE onmouseover=this.stop() onmouseout=this.start() style="WIDTH: 160px; HEIGHT: 300px" height=300px scrollAmount=2 scrollDelay=50 direction=up>


    Alpha Section
    <br><br>
    FatRat
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=302197"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=302197&style=6"></a>
    <br>


    Sgt_Pepper
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=356408"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=356408&style=6"></a>
    <br>

    Nezoril
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=274271"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=274271&style=6"></a>
    <br>



    Eagle916
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=396485"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=396485&style=6"></a>
    <br>

    Ssj4Pyro
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=399323"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=399323&style=6"></a>
    <br>

    Sgt.Maj.Friel
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=366495"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=366495&style=6"></a>
    <br>

    gtrmn768
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=398442"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=398442&style=6"></a>
    <br>

    VaGaRoTh
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=401730"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=401730&style=6"></a>
    <br>


    InsertNickHere
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=219434"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=219434&style=6"></a>
    <br>

    CasasS
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=401473"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=401473&style=6"></a>
    <br>


    <br>
    India Section
    <br>
    <br>


    <br>
    Recruit Section
    <br>
    <br>










    JuGge
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=400899"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=400899&style=6"></a>
    <br>
    sn34keR
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=403131 "><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=403131&style=6"></a>
    <br>
    PersianKnight
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=315821"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=315821&style=6"> </a>
    <br>




    Khan
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=211206"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=211206&style=6"></a>
    <br>
    Sharpshooter
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=400035"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=400035&style=6"></a>
    <br>


    Scope
    <a target="_blank"
    href="http://aaotracker.4players.de/usertracker.php?userid=260788"><img
    border="0"
    src="http://aaotracker.4players.de/trackericon.php?userid=260788&style=6"></a>
    <br>


    </marquee>
    </div>
    </div>

    </form>
    Last edited by fatrat; 10-08-2005 at 12:57 PM.

  • #10
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    People still use marquee? LOL

    Anyway, the important thing is for you to understand the little example code, then you can modify it however you want.

    Code:
    function toggle(e, theId)
    {
       if (e.value == "yes")
       {
          document.getElementById(theId).style.visibility = "visible";
          document.getElementById(theId).style.display = "block";
       }
       else
       {
          document.getElementById(theId).style.visibility = "hidden";
          document.getElementById(theId).style.display = "none";
       } 
    }
    This is just a little example. The function assumes a form control that has a value property, then checks that value and compares it to the string "yes" to decide whether to show or hide the element whose ID was passed in.

    If you want to use an image or other control, modify this to take just a normal string or a boolean (true/false) to determine what to do (IOW, remove the .value part of if (e.value=="yes") and change "yes" to the value you want to indicate a "yes, show the div")
    Then in the event you want to trigger the function, send the string or boolean.
    i.e.
    <img onMouseOver="toggle(true,'divid');">
    or
    <img onMouseOver="toggle('show','divid');">

    The function line that has
    if (e.value == "yes")
    would be modified, respectively, as

    if (e)

    or

    if (e == "show")

    Does that help?

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #11
    New Coder
    Join Date
    Oct 2005
    Location
    South River, Ontraio, Canada
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by nikkiH
    People still use marquee? LOL
    Don't be dissing Marquee...I've seen some sites that use it well. Mainly for advertising. (I'm not being an *** about it either...)
    -Dave Smith-Hayes

  • #12
    Senior Coder nikkiH's Avatar
    Join Date
    Jun 2005
    Location
    Near Chicago, IL, USA
    Posts
    1,973
    Thanks
    1
    Thanked 32 Times in 31 Posts
    I wasn't really dissing it.
    It just isn't standard html, thus it is not cross-browser. I thought most sites at least attempted to work in most browsers.

    If this post contains any code, I may or may not have tested it. It's probably just example code, so no getting knickers in a bunch over a typo, OK? If it doesn't have basic error checking in it, such as object detection or checking if objects are null before using them, put that in there. I'm giving examples, not typing up your whole app for you. You run code at your own risk.
    Bored? Visit
    http://www.kaelisspace.com/

  • #13
    Regular Coder
    Join Date
    Oct 2005
    Posts
    127
    Thanks
    0
    Thanked 0 Times in 0 Posts
    so how do u get tables to auto scroll??


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •