I have decided to try something new and add a lightbox contact us form. I found a free script online and when I tested the form by itself, the lightbox worked great, but once I applied it to the website I'm working on, the lightbox stopped working.
I have another jquery script running, but I don't think that it is interfering with the lightbox. I took that script out and the lightbox still didn't work.
Here is the website that I got the script from: http://www.ericmmartin.com/projects/simplemodal-demos/
(scroll down the the 'Contact Form' section of the website for the source code and a demo)
Here is the working version after I edited the css: http://www.my-testing-area2.netau.net/website_projects/soldiers_of_america/Jquery-Light-Box/
Here is the website I tried to apply it to: http://www.my-testing-area2.netau.net/website_projects/soldiers_of_america/index.php
(click the 'Contact Us' button to the left side)
These are some of the code that I used when applying the lightbox to the website:
CSS link:
Lightbox link:HTML Code:<!-- START LIGHTBOX CSS --> <link rel="stylesheet" type="text/css" href="Jquery-Light-Box/css/contact.css" /> <!-- END LIGHTBOX CSS -->
Scripts (This code is inserted right above the </body> tag):HTML Code:<div id='contact_form'> <a href='#' class='contact'><div id="contact_us"></div></a> </div>
Here are the two Jquery links I have:HTML Code:<!-- START LIGHTBOX SCRIPTS --> <script type='text/javascript' src="Jquery-Light-Box/js/jquery.js"></script> <script type='text/javascript' src='Jquery-Light-Box/js/jquery.simplemodal.js'></script> <script type='text/javascript' src='Jquery-Light-Box/js/contact.js'></script> <!-- END LIGHTBOX SCRIPTS -->
(The top is for an expanding div. The second script is for the lightbox.)
HTML Code:<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>Ideas?HTML Code:<script type='text/javascript' src="Jquery-Light-Box/js/jquery.js"></script>