I have thumbnails which pop up via Fancybox (a lightbox alternative) but am coding a more iPhone friendly version where I would like the links to just link to the associated image or youtube page, ignoring the Fancybox class altogether - how do I achieve this?

1 answer

danwellman 5600

What I would do is change your script slightly so that the configuration objects for fancybox are stored independantly from the initialisation code, and then do a bit of user-agent sniffing. If the iPhone (or iPad) is not detected, then initialise the fancybox. Something like this should do it:

$(document).ready(function() { 

    var ua = navigator.userAgent;

    if (ua.match(/iPhone/i) !== null) {
             'overlayShow' : false,
             'margin' : 0,
             'padding' : 0,
             'autoScale' : true,
             'hideOnContentClick': true,
             'showCloseButton' : false,
             'hideOnOverlayClick': true,
             'overlayShow' : true,
             'overlayColor' : '#009892',  
             'overlayOpacity' : 1,
             'titleShow' : true,
             'speedOut' : 0,
             'transitionIn' : 'none',
             'transitionOut' : 'none'

You can do the same for the video links too

[EDIT] - ok, try it with the above script, slightly modified

Answered over 8 years ago by danwellman
  • This seems to just cancel the fancybox completely (at least as viewed through Chrome here) - see http://www.liambrazier.com/index1.html Liam Brazier over 8 years ago
  • see the edit danwellman over 8 years ago
  • That still seems just to disable it altogether. Liam Brazier over 8 years ago
  • Ok, well try it as it was before with the config object inline and the if statement around the call to .fancybox() danwellman over 8 years ago