WordPress.org

Ready to get started?Download WordPress

Forums

Slideshow
[resolved] css variables for size (5 posts)

  1. technobuddha
    Member
    Posted 4 months ago #

    I'm trying to setup a condition for a specific slide show.
    I am using "mobile css", to change a css variable so that when a user is looking at the slideshow via mobile, the css will change.

    so I'd like to know what css varables are used for:
    "Shrink slideshow's height when width shrinks"
    I'd like it to be "yes", when its mobile, and "no", when its desktop.

    See, when its set to "no", and a user sees the slideshow on mobile, then the height is very large, and the width just "shrinks" so the whole image gets distorted. So I need to have the height able to shrink while on mobile.

    What css variable sets this?

    Also, if the css is set to "no", the default is 480, which is fine. Does this need to be set as well?

    hmmm unless there is a responsive variable I don't see on slider???

    thanks!

    http://wordpress.org/plugins/slideshow-jquery-image-gallery/

  2. technobuddha
    Member
    Posted 4 months ago #

    ok, so I was able to figure out the auto aspect:

    .slideshow_container .slideshow_slide {
    width: auto!important;
    height: auto!important;
    }

    although this works, the images themselves only show partially.

    but what is the setting for "shrink to fit"???

    thanks!

  3. Stefan Boonstra
    Member
    Plugin Author

    Posted 4 months ago #

    I'm sorry, it's not possible to make a difference in the slideshow's settings by using CSS. Most CSS settings are overridden by the slideshow's script.

  4. technobuddha
    Member
    Posted 4 months ago #

    ahhh ok. thanks!

  5. technobuddha
    Member
    Posted 4 months ago #

    Ok, so I was able to achieve mostly what I wanted. I now have the auto height and width that changes via mobile with using this css:

    @media only screen and (max-device-width: 480px) {
    .slideshow_container .slideshow_slide {
    height: auto!important;
    }
    }

    AND, by making the images exactly how I want them to be via desktop, and change the setting "Image behavior" to natural and centered.

    BUT, there is a minor page cosmetic issue, that I have described in another thread here. (since its a different issue) and making this resolved.

Reply

You must log in to post.

About this Plugin

About this Topic