Jquery is undefined error in web app detail layout

[BlancPrinting630]

I'm having a weird js issue, and was wondering if anyone had some insight as to why this is happening.

- I'm using a jquery plug in to generate a full photo background that resizes with the browser window.

- I have a webapp built. On the "detail layout" , the background image is not showing.

- I'm using a page template for the detail layout, that is also used in other areas of the site.

- It's ONLY on the detail layout for this web app that the background isn't showing. The other pages using the template (like the FAQ page) show it as it should.

- It's not working in every browser that I've tested. (IE7/8/9, Firefox, Safari and Chrome)

In IE 8, I get the error "Jquery is undefined" on line 10 of the main bgstretcher.js file, which is the opening line with (function($){

I've been troubleshooting this for a while, but can't seem to pinpoint why this is happening. Any help is much appreciated!

Link to detail view of a web app item: http://deacon01.businesscatalyst.com/product-display/deacon-770-p

Link to page that is using the same template, but the BG works: http://deacon01.businesscatalyst.com/faq

Thanks!

[Chad_-_BCGurus_com]

Hello BlancPrinting630,

This is happening because  you're jQuery file path isn't correct. You have this:

<script src="js/jquery-1.5.2.min.js" type="text/javascript"></script>

Which will work for top level pages, this is why the faq page is working.  But to get the inner pages to work you need to add a / to the file path, so like this:

<script src="/js/jquery-1.5.2.min.js" type="text/javascript"></script>

That will get it to work for you.

Hope this helps,

Chad Smith | http://bcgurus.com/Business-Catalyst-Templates for only $7

[Liam Dilley]

As a note this applies to all source files from javascript to CSS to images, everything needs to have / in front of it so BC knows to ready from the route.