SitePoint Sponsor

User Tag List

Results 1 to 3 of 3

Thread: Dropdown Form

  1. #1
    Non-Member bigrollerdave's Avatar
    Join Date
    Mar 2005
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Dropdown Form

    I'm really bad with javascript I usually just do everything using php . With that said I'm trying to make a script where you will roll over a link and a drop down will come down and users can submit a form in the drop down. Confused yet? Here is an example roll over the search link. I've tried to look at their soucre code to see how they did it but it's way too confusing. I've also tried google like 100 times no help. Could someone point me in the right direction or show me how to do this?

    Thanks for the help

  2. #2
    SitePoint Member
    Join Date
    Mar 2006
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Give the form an id
    Code:
    <form id="formid" ...
    and in your css, set that specific form's display = none; You can also do this with the form's height or position, depending on the effect you want.
    Code:
    #formid {
    display : none;
    }
    Use javascript to change the display value to block when you mouse over the element you want to trigger the drop down.

    Code:
    <html>
    <head>
    ...
    <script type="text/javascript" language="javascript">
    <!--
    function showForm() {
    document.getElementById('formid').style.display = "block";
    }
    -->
    </script>
    ...
    </head>
    <body>
    <div onmouseover="showForm();">Mouse over me</div>
    ...
    If you want to close the form up, use javascript to change the display value back.

    Code:
    function hideForm() {
    document.getElementById('formid').style.display = "none";
    }
    and call that function from whatever you want to trigger it... a piece of text, button, onmouseout of the form, etc.

  3. #3
    Non-Member bigrollerdave's Avatar
    Join Date
    Mar 2005
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Awesome I got it thanks a lot


Bookmarks

Posting Permissions

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