very annoying little jQuery problem

[rufus:]

hey guys, iv been doing this new site for my uncle and i want to toggle the text box on the page to show and hide the picture behind. iv been stuck on this for ages and im getting a bit frustrated so i wondered if anyone can help!

the web address is (for the time being) www.yunitube.co.uk

i hope someone can shed some light for me. i have used this bit of simple code as well as referring to the jquery library at the start of the page:

$(document).ready(function() {
$("#v_toggle").click(function() {
$("#vertical_slide").toggle();
});
});

for some reason i cant get it to work. basically, i would like the user to click the question mark on the page and it shows and hides the text box.. ok im repeating myself now.

im not really sure if it is a problem with the jquery, or i have done something naughty that the css doesnt like...

i dont know!

please help!

THANKS

[venegal]

You must not use <script> tags within external .js files.

[rufus:]

it pains me to admit that i didnt know that before posting.. it still doesnt work even now though, when i changed them! im thinking it might have something to do with the slideshow jquery or something?!

thanks for your reply!

[venegal]

You have to be careful regarding the order in which you load external .js files. The way you are doing it right now, you are trying to use jQuery methods before even having loaded jQuery. Just load your own script last, after having loaded all the framework stuff, and not first, like you are doing now.

Also, use a Javascript debugger, like Firebug. If your scripts are dying silently you won't ever have a chance of finding out why they won't work.

[rufus:]

ohhh... man that's awsome, thanks so much.

i knew it would be something so simple, and stupid. i always stumble up.

all the best!