show/hide javascript function

Question

The following javascriot function shows/hides a contact form. When using function in a stand alone html page the form is hidden by default. When I implement the function in my website the function behavior is reversed and the form is not hidden by default.

Can someone with javascript experience advise how to reverse the show/hide bevavior of the function below.

Thanks in advance.

</script>

<!-- Show/Hide Contact Form  -->
<script type="text/javascript">
    //showHide function 
    $(document).ready(function () {
        $('.nav-toggle').click(function () {

            //get collapse content selector
            var collapse_content_selector = $(this).attr('href');

            //make the collapse content to be shown or hide
            var toggle_switch = $(this);
            $(collapse_content_selector).toggle(function () {

                if ($(this).css('display') == 'none') {
                    toggle_switch.html('Show Form');
                } else {
                    toggle_switch.html('Hide Form');
                }

            });

        });

    });
</script>

Answer 1

It would be much easier to answer if you'd provided HTML of your form... Okay, I hope you will figure out the solution:

Look at the value of href attribute if the toggle link, it should look like '#something' and then just edit the css file and add the following line at the bottom:

#something { display: none }

So, make sure you replace something with the actual value from the toggle link.