Lightbox freezes/crashes when tested for mobile phones in Device Central

[Irena]

I installed LB v2.05 on a cake website I'm building. I have a slideshow on the front page (not using LB) and a menu on p3 with linked pics using LB. When I tested the code in Device Central, the LB image just freezes and there's no way to get rid of the popup and return to the web page because the image takes up the whole screen (with just a little grey at the bottom). I experimented with a generic flash lite simulator and a Nokia 6126. I'm still using DW CS4 so don't have any Apple devices to test on but can arrange that later.

I don't think it's a window size issue. I manually resized one of the LB pics to the same size as the slideshow ones -- made no difference. All that I've identified is that the caption and "close" area of the LB popup won't render on the small screen, thus freezing the browser.

I'm a total newbie (*apols*) & only know html & css. Any java gurus with solutions please?? Should I abandon LB and just go with opening a new window thru CSS each time a user wants to click on a menu item to see what the cake looks like? How do other websites cope with all the mobile devices? I'm finding it so frustrating because the site works perfectly on a desktop. Thanks for any help.

[jscheuer1]

Moderator's Note:
As part of our automatic spam filters, posts on this topic might be automatically moderated. That means your post might not show up right away. Please be patient, a moderator will approve it (make it visible) as soon as they notice it and have a few moments to do so.

First thing is to try the demo page of the script:

http://www.lokeshdhakar.com/projects/lightbox2/

if that has the same problem, then it's a problem with the script.

There's a good chance that's your answer though because I've seen around the web where these box type scripts have problems in mobile devices.

One option would be to disable lightbox for mobile devices. That's the approach taken by slimbox:

http://www.digitalia.be/software/slimbox2

In fact, If that's the approach you want to take, I would recommend changing to it, and using the live load invocation introduced here:

http://www.dynamicdrive.com/forums/blog.php?b=247

However it's done, disabling the box for mobile devices will result in users of those devices being taken to the image from which they can easily use the back button of their browser to return to the main page.

If you want to do this with lightbox 2.05, edit lightbox.js. At the end add the highlighted as shown before the very last line:

		}

		return [pageWidth,pageHeight];
	}
}

if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent))
document.observe('dom:loaded', function () { new Lightbox(); });

I'm pretty sure this is a common problem though, so some Googling might find you a solution, if not for lightbox, perhaps with other box type scripts.