JavaScript snippet enabling one specific function, but disabling many others sitewide

I am performing some very minor customizations on a clients’ website, and one of those is adding a popup video feature in Fancybox. I have used the code from another programmer, and it works quite well. The only problem is, a snippet of JavaScript is disabling nearly all of my animations, including a thumbnail slider, a popdown credit card entry field, a few javascript dependent actions and animations, and anything else that requires JavaScript. Here is the snippet that is basically turning off all of my Javascript:

—

$(“.colcontent”).hide();
//toggle the componenet with class msg_body
$(“.coltitle”).click(function()
{
$(this).next(“.colcontent”).slideToggle(200);
});

});

—

When I delete this line of code, the animations work. When I insert it in (with the other bit of JavaScript), the Fancybox works, but animations do not.

Here is the full line of code:

—

<script type=”text/javascript”>
jQuery(document).ready(function($){

$(“#tip4”).click(function() {
$.fancybox({
‘padding’ : 0,
‘autoScale’ : false,
‘transitionIn’ : ‘none’,
‘transitionOut’ : ‘none’,
‘title’ : this.title,
‘width’ : 680,
‘height’ : 495,
‘content’ : ‘static/common_structure.html’,
‘href’ : this.href.replace(new RegExp(“watch?v=”, “i”), ‘v/’),
‘type’ : ‘iframe’,
‘iframe’ : {
‘scrolling’ : ‘auto’,
‘preload’ : ‘true’
}
});

return false;

});

$(“.pop”).fancybox({
‘width’ : 600,
‘height’ : 600,
‘autoScale’ : false,
‘transitionIn’ : ‘none’,
‘transitionOut’ : ‘none’,
‘type’ : ‘iframe’
});

$(“.webinar”).fancybox({
‘width’ : 600,
‘height’ : 400,
‘autoScale’ : false,
‘transitionIn’ : ‘none’,
‘transitionOut’ : ‘none’,
‘type’ : ‘iframe’
});

$(“.sizing”).fancybox({
‘width’ : 800,
‘height’ : 800,
‘autoScale’ : false,
‘transitionIn’ : ‘none’,
‘transitionOut’ : ‘none’,
‘type’ : ‘iframe’
});

</script>

—

Any help would be greatly appreciated!!! I’m using WordPress, WooCommerce 1.65

Also in #JavaScript _↴