prototypejs altering jquery method

Question

On my page here: redacted

I'm getting the following error: Uncaught TypeError: Cannot read property 'hide' of null, and the element that's supposed to drop down just stays covering the top of the page (the big white image)

When I delete prototype.js the header image drops down from the top as it's supposed to. My working knowledge of javascript is very basic so I can't see what the issue is.

What would be the easiest solution to this problem, assuming I need both js files?

Thanks!

Edited: redacted URL - the solution used was to add : var $j = jQuery.noConflict(); at the top of the jQuery scripts and replace all instances of $ with $j. Much appreciated.

Answer 1

before your .ready() function, write jQuery.noConflict();

read more here