I'm creating my design portfolio website with Joomla (Still a jQuery problem, don't run away!) and I have come across a problem. The template seems to have problems with the lightbox I am using. The lightbox will not show in IE or Safari, it just opens the image in a new blank white page. After a little bit of research I thought I'd try the no conflict mode. Bear in mind I know almost NOTHING about javascript and jQuery. So I added this:

<script type="text/javascript">

to my index page just after:
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template ?>/js/jquery-1.7.2.js"></script> etc. etc.

and before <head>

I thought.. that can't be it, but then I tested and voila! The lightboxes were working in Safari and IE. That was awesome.. until I realized that line of code screwed up my menu. It made it so that the menu on the Design and Contact page would only show the right hand side of the background image, and the background no longer showed up on hover - only when active, and incorrectly.

So can anyone help a complete js/jquery noob out here? Please?

My Portfolio Website