Need some advice

JavaScript
1

On my home page, I have a video area. I have a Jquery script that adds a curtain overlay to the video and then draws the curtains open to reveal the video behind it. It works fine in Firefox, but not in IE or Safari, not sure about other browsers. Can someone help me fix this so it works in those browsers please?

Thanks.

2

Which script handles that effect?

3

Here is the script:

<script type="text/javascript" src="http://billboardfamily.com/wp-content/themes/DeepFocus/js/jquery.js"></script>
<script type="text/javascript" charset="utf-8">
	$(document).ready(function(){
          $('.content').show().find('object').append('<param name="wmode" value="transparent" />').find('embed').attr({wmode: 'transparent'});
         $('.content object').hide().show();

         // when user clicks inside the container...
         $('.curtain_wrapper').click(function(){
            
            //..animate the description div by changing it's left position to it's width (but as negative number)...
            $(this).children('.description').animate({'left': -1*$(this).width()});
            //...animate the 2 curtain images to width of 50px with duration of 2 seconds...
            $(this).children('img.curtain').animate({ width: 104 },{duration: 2000}, function(){
            $(this).children('.content').fadeIn(2000);
            });   
            
         });
         
      });
$(function () {
   $('a[title="Free hit counters"]').hide();
}); 
$(function () {
   $('a[title="View stats"]').hide();
});
	</script>

and the HTML

<!--START THE WRAPPER--> 
<div class='curtain_wrapper'>

	<!-- 2 CURTAIN IMAGES START HERE  -->
	<img class='curtain curtainLeft' src='images/curtainLeft.jpg' />
    <img class='curtain curtainRight' src='images/curtainRight.jpg' />
    <!-- END IMAGES -->

    <!-- START THE CONTENT DIV --> 	
	<div class='content'>
		<!-- YOUR CONTENT HERE -->
	<div id="main-video" style="text-align:center;">
<?php echo do_shortcode('[youtubefeed limit="1" height="447" width="750"]'); ?>
	</div>

        <!-- END YOUR CONTENT -->
    </div></div>
    <!-- END THE CONTENT DIV -->

<!-- START DESCRIPTION DIV, WHICH WILL BE SHOWN ON TOP OF THE CURTAIN AND REMOVED WHEN THE CURTAINS OPEN -->
    <div class='description'>
    	Click anywhere to reveal
    </div>
    <!-- END DESCRIPTION DIV -->
    
</div>
<!--END THE WRAPPER-->