简体   繁体   中英

Nivo Lightbox notopening on an iPhone, but does work on iPad

Here is a URL with images that you can test this out on:

http://www.imageworkshop.com/2013/06/19/dance-performer-promo-photography/

To be clear - at one point, all these images were opening on my iPhone in the Nivo lightbox. But it has been inconsistent. For a while, some blog post images would open, others would not.

At present, none of them seem to be opening in the nivo lightbox on the iPhone - it is however, working on the iPad?!

The following code in my header is relevant to the Nivo Lightbox (initiating the lightbox and also adding swipe functionality):

    <script src="<?php bloginfo('stylesheet_directory') ?>/js/nivo-lightbox.min.js"></script>
    <script>
    jQuery(document).ready(function(){          
            jQuery('a.jig-link').nivoLightbox({effect: 'slideRight'});
            jQuery('.lightbox').nivoLightbox({effect: 'slideRight'});                   
    });
    </script>       
    <script src="<?php bloginfo('stylesheet_directory') ?>/js/jquery.touchwipe.min.js"></script>
    <script>    
    jQuery(document).ready(function(){
        jQuery('body').touchwipe({
            wipeLeft: function(){ jQuery(".nivo-lightbox-next").click(); },
            wipeRight: function(){ jQuery(".nivo-lightbox-prev").click(); },
             min_move_x: 70,
             min_move_y: 70,                 
             preventDefaultEvents: false                 
        });
    });     
    </script>

This is an example of how the images are wrapped up. If you have any suggestions on why this isn't working I'd appreciate the help!

<div id="attachment_2143" class="wp-caption aligncenter" style="width: 570px">
<a class="lightbox" title="Dance performers: promotional dance photography" 
 data-lightbox-gallery="gallery1" href="http://www.imageworkshop.com/wp-content/uploads/2013/06/13006-0047-Image-Workshop-Melbourne-photography.jpg">
<img class="size-large wp-image-2143 " width="560" height="560" src="http://www.imageworkshop.com/wp-content/uploads/2013/06/13006-0047-Image-Workshop-Melbourne-photography-560x560.jpg" alt="Promotional dance photography by Sharon Blance of the Image Workshop" title="Promotional dance photography by Sharon Blance of the Image Workshop">
</a>
<p class="wp-caption-text">Pete & Steph</p>
</div>

NIVO LIGHTBOX DETAILS: The javascript can be viewed here: https://github.com/gilbitron/Nivo-Lightbox/blob/master/nivo-lightbox.js

CSS can be viewed here: https://github.com/gilbitron/Nivo-Lightbox/blob/master/nivo-lightbox.css

This appears to have resolved itself. I have also upgrade to the new v1.1 of the NIVO LIGHTBOX plugin, which might also be helping (although this was not the direct resolution to the issue)

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM