Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums JavaScript AnythingSlider: center image slide horizontally and/or vertically

  • This topic is empty.
Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #35455

    Hi,
    I’m using AnythingSlider to implement a photo slideshow. I have to display both vertically and horizontally oriented pictures and I don’t want them to deform to accomodate a fixed slider size, so I’m using the option “resizeContents: false” and it’s working fine. The problem is that now I’d like to center the images. How can I do this?

    #91822
    Mottie
    Member

    Hi ilSignorCarlo!

    Are all of the slider panels the same size? The slider was designed to resize to fit the content, so you shouldn’t have to center the image in the slider. If not, then try using “text-align:center” and “vertical-align:middle” to center the image.

    #91824

    Well, since I’m using that option the slider panels have the size of the picture they contain.
    Imagine I have an external div with height: 600px. I resize my vertical pictures to have height: 600px, so they fit perfectly. I cannot do the same with horizontal pictures, so they will have a height less than 600px. I would like these pictures to appear vertically centered in the div or at least aligned with the bottom margin to the bottom of the container div.

    #91838
    Mottie
    Member

    So I grabbed the css from this post and incorporated it into this demo. The only problem I noticed was that I had to set the slider height otherwise the first slide wasn’t set correctly…

    #slider, #slider li {
    height: 200px;
    list-style: none;
    }

    It looks like that’s a bug that I’ll need to fix.

    #91856

    wow, thanks. that’s perfect.
    in the bit of code you posted here, how did you choose the height: 200px? it’s just a small number?

    #91858
    Mottie
    Member

    The first image has a height of 200px… if I leave it blank, the slider height starts out as the tallest slide. Like I said, I need to fix that.

    #91901

    ok, thanks again : )

Viewing 7 posts - 1 through 7 (of 7 total)
  • The forum ‘JavaScript’ is closed to new topics and replies.