Forums

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

Home Forums CSS AnythingSlider and 100% Width/Height Problem

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #34829
    bunkmoreland
    Member

    Hello. Trying to implement AnythingSlider with a 100% width and height that will adjust to maintain the correct image ratio (ie not stretch the image). I was able to setup the slider with 100% width without a problem, but I’m having trouble getting the height to adjust.

    Currently I have the parent container set to a fixed height, but when it is removed or set to 100% the slider collapses. Any thoughts on how to fix?

    Demo can be found on:
    http://m-lum.com/staging/poverup/slideshow.html

    If I should post specific code snippets just let me know. Thanks in advance.

    #89316
    Mottie
    Member

    Try this:

    $(window).resize(function(){
    $('#wrapper1').height( $(window).width()/2.3 );
    });

    The images inside of AnythingSlider are 1161×500 in size, or they have an aspect ration of approximately 2.3 (1161 divided by 500).

    So what that code does is applies that same aspect ratio to the container around AnythingSlider (#wrapper1). And since the “expand” option is true, the slider will expand to fit inside of that container and maintain the ratio you want.

    #89363
    bunkmoreland
    Member

    Awesome, that works perfectly. Thanks for the help Mottie!

    #101855
    krearts
    Member

    an example to 100% width krearts.com, hope this help to any one

    #126278
    okta2510
    Member

    tq ill try

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