I have this page: http://tinyurl.com/5hascg. I'm using JQuery for a
few things - :hover on the main content blocks, form validation, and
show/hide.

By themselves, everything is working great! But it's the
interoperability of the last two that are causing me a headache. When
you click anywhere in the "For your home" box, the content appears.
There's a form in that <div>. However, when you try to focus in that
<div> by clicking, the form hides.

So, what I'd like to know is how to show the <div> contents by
clicking anywhere in the <div>, but only hide it by clicking on the
header (which I've temporarily given a background color of green to
make it stand out).

For reference, here's the contents of my $(document).ready section
which is linked from the page above. Thanks!:

$(document).ready(function(){

   // Add class to shift background images on load
   $('#box_home').addClass('pageload');
   $('#box_business').addClass('pageload');
   $('#box_account').addClass('pageload');

   // Show/hide forms
   $('div#homepage_boxes form').hide();
   $('div#homepage_boxes> div.col').click(function() {
      $
(this).siblings('.selected').andSelf().toggleClass('selected').end().end()
         //.next('form').slideToggle('fast')
         //.siblings('form:visible').slideUp('fast');
   });

   // Add homepage box hover effect for IE6
   $('div#homepage_boxes .col').hover(function() {
      $(this).addClass('ie6boxhover');
   }, function() {
      $(this).removeClass('ie6boxhover');
   });

   // Form validation
   $.validator.setDefaults({
      submitHandler: function() { alert("submitted!"); }
   });

   $("#homeform").validate({
      rules: {
         txtZipcode: {
            required: true,
            minlength: 5
         }
      },
      messages: {
         txtZipcode: {
            required: "To continue processing your request, we need a
5-digit zip code.  Please re-type the zip code of your service
address.",
            minlength: "Your zip code must be 5-digits long. Please re-
type the zip code of your service address."
         }
      }
   });
});

Reply via email to