WordPress.org

Ready to get started?Download WordPress

Forums

Simple Lightbox
[resolved] Mobile Responsive and Lightbox Images (3 posts)

  1. Lindy_xo
    Member
    Posted 1 year ago #

    Is there anyway to control the size of the lightbox images so they open "fit to screen" on a mobile device?

    My Url

    The 3 accessories at end of page open in a lightbox which blows out the iPhone. Thanks :)

    http://wordpress.org/extend/plugins/simple-lightbox/

  2. Archetyped
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,

    Images are displayed at their original size to maintain optimum image quality. Resizing images to their desired display size prior to uploading is recommended.

    You can see more usage notes on SLB's official page.

    SLB 2.0 will support automatic resizing.

  3. hilmon
    Member
    Posted 1 year ago #

    I found it best to display larger images for mobile devices and just remove the lightbox functionality ... I remove the <a> around the image with jquery...

    window.addEventListener("load",function() {
      var w = $('.wrapper').width(); // reference the container you want
      if( w < (500)){ // change to whatever you want
        $(".gallery-icon a:has(img)").each(function() {
          $(this).replaceWith($(this).children());
        })
      }
    });

    In my css I have the following which shows each image full screen on mobile portrait ...

    @media only screen and (max-width: 360px) {
      .gallery-item {
        float:none;
        width:80%;
        margin:0 auto 5%;
      }
      .gallery br {
        display:none;
      }
    
    }

    Works a treat!!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.