Why does this one page work and the other one does not?

I've got two page that are pretty much the same, but one works and the other does not. I've gone through and tried to detail the differences, but in the end I'm missing something so I'm needing another set of eyes to tell me where I'm blowing it.

Head out to to http://thornhilllawncare.com/gallery_view.php?album_name=Irrigation. Click on one of the photo thumbnails and you're watching a Javascript function kick in.

Nice.

Now go to http://thornhilllawncare.com/mobile/gallery_view.php?album_name=Irrigation. It's the mobile version of the same page, but I can't get the "PrettyPhoto" Javascript thing to kick in and I can't figure out why.

Thoughts?
brucegustPHP DeveloperAsked:
Who is Participating?
 
Dave BaldwinFixer of ProblemsCommented:
Actually, the desktop view has three copies.  Line 8 with "js/jquery.js" is an old version of jquery and should be removed.

On the mobile view where it says "LOAD JAVASCRIPT LATE - JUST BEFORE THE BODY TAG "... it actually needs to be before the </head> tag also so it is 'in' the <head> section.  You have a bunch of other errors there also.
0
 
Marco GasiFreelancerCommented:
You have some problem here: in the desktop page you're includinh jquery twice: this doesn't create conflict since you're including the same version, but it's an unneeded spending of resource and it's slowing down the page.

In the mobile version also you include jquery twice, but you're including two different version: 1.6.1 by your local directory and 1.8.1 from Google repository: this sure prevents your script to work as expected: include only 1.6.1.

Cheers
0
 
Ray PaseurCommented:
I'll bet once you've got the jQuery right, you will have a lot of the issues solved, but there are other things lurking below the surface.

A trip to the W3 validator will not catch everything, but it should be one of those steps that gets repeated frequently as you add functionality or styling into a web site.  Check this issue:

http://validator.w3.org/check?uri=http%3A%2F%2Fthornhilllawncare.com%2Fgallery_view.php%3Falbum_name%3DIrrigation&charset=%28detect+automatically%29&doctype=Inline&group=0

If you need some help with the character encoding, this article may help:
http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/A_11880-Unicode-PHP-and-Character-Collisions.html
0
 
leakim971PluritechnicianCommented:
you've two jQuery version running...
found and replace :

$(document).ready(function(){
$("area[rel^='prettyPhoto']").prettyPhoto();

Open in new window

by this :
jQuery(function($) {
$("area[rel^='prettyPhoto']").prettyPhoto();

Open in new window

0
 
brucegustPHP DeveloperAuthor Commented:
Cleaned up the various libraries, moved the "LOAD JAVASCRIPT LATE - JUST BEFORE THE BODY TAG" into the head section and all is well.

Thank you, gentlemen!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.