WordPress.org

Forums

JSJ Gallery Slideshow
[resolved] Responsive max-height and max-width (4 posts)

  1. johnnynext
    Member
    Posted 1 year ago #

    Hi!,

    Is it possible to use max-height and max-width instead of height, width? I edited the page in safari web inspector mode and simply changing this:

    <div id="galleryid-1" data-total="4" class="gallery galleryid-613 gallery-columns-3 gallery-size-full" style="position: relative; width: 795px; height: 596px;">

    to this:

    <div id="galleryid-1" data-total="4" class="gallery galleryid-613 gallery-columns-3 gallery-size-full" style="position: relative; max-width: 795px; max-height: 596px;">

    allows me to resize the slideshow and make it responsive. Where can I edit to make this happen?

    http://wordpress.org/plugins/jsj-gallery-slideshow/

  2. Jorge Silva-Jetter
    Member
    Plugin Author

    Posted 1 year ago #

    Hi,

    First, thanks for trying to mess around with the plugin and seeing there's a better way to make it work.

    Would it be possible to include some screenshots of how it looks?

    I've spent about an hour trying to figure this out and here's the conclusion I came to:

    The reason the gallery container div needs a height is because of it needs a height in order to calculate the animation of the container as the images change. The images are position absolute, so the div needs a height in order to be displayed. If you want to see for yourself, try commenting this line in the plugin (jsj-gallery-slideshow.php):

    if(sh > 1) jQuery(this).parent().clearQueue().animate({ height: sh }, <?php echo $input_value; ?> ); // Line 366

    Anyways, if you think I'm wrong (that's quite possible) and there's actually a solution to this, see if you can mess around with the plugin and get it to work. I'd be glad to include the new code in the plugin if the solution is good and works. Doing it with the inspector won't really work, cause there's a lot of stuff it does when the plugin is being loaded in order to calculate how to display it correctly.

    All that being said, I know that this plugin is not responsive at all, and that's something that might make it to the next version or something. Cycle 2 (the jquery library that this plugin is built on) is much better at responsive.

    Cheers!

    J.

  3. johnnynext
    Member
    Posted 1 year ago #

    Thanks for the quick response!
    I´ve been investigating this and the closest i got to it is setting container resize = 0. This makes it responsive but the first time you load the page the slide animates to maximum size which is kind of weird. At least it´s responsive so i guess i´ll leave it this way until you start using cycle 2.

    You can see it in action in this post: http://johnnynext.com/2013/12/03/shark-cage-diving/

    Thanks!

  4. Jorge Silva-Jetter
    Member
    Plugin Author

    Posted 1 year ago #

    This seems to work pretty well. I might change the default to '0' on the container size, so it could be more easily made responsive.

    In the meantime, I've added a jQuery function that re-creates the slideshow when the window size changes, so if someone resizes their browsers, the images would look correct. That will make it into the next version of the plugin.

    Let me know if you have any other thoughts on the plugin.

    If you find it useful and think it's good, go ahead and give it a review on wordpress.org!

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • JSJ Gallery Slideshow
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic