[Plugin: Simple Lightbox] Mobile Responsive and Lightbox Images

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Archetyped

    (@archetyped)

    11 years, 7 months 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.

    hilmon

    (@hilmon)

    11 years, 1 month 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!!

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘[Plugin: Simple Lightbox] Mobile Responsive and Lightbox Images’ is closed to new replies.