Grow your CSS skills. Land your dream job.

AnythingSlider with expand: true not resizing for wider screen

  • # January 11, 2013 at 1:54 pm

    Hi all,

    I’ve got a slider here: http://www.trismi.com/so/index.html

    I’ve initialized the slider with the following parameters:

    {
    mode: “horizontal”,
    expand: true,
    resizeContents: false,
    buildNavigation:false,
    buildStartStop: false,
    onInitialized: function()
    {
    var slideTemp = $(‘#mobile-slider’).data(‘AnythingSlider’);
    $(‘.page-counter’).text( slideTemp.currentPage + ” / ” + slideTemp.pages );

    },
    onSlideComplete: function()
    {
    //sets up the x of x pages count
    var slideTemp = $(‘#mobile-slider’).data(‘AnythingSlider’);
    $(‘.page-counter’).text( slideTemp.currentPage + ” / ” + slideTemp.pages );

    }
    }

    When I make a screen smaller, the slider resizes appropriately and gets smaller. However, when I make the slider wider (basically, mimicking a phone flipping from portrait to landscape), it doesn’t widen to fill the screen, and looks weird because the rest of the screen has a fluid layout that expands to fit the screen. I see the expand demo and it works the way I would expect, so I’m wondering why this doesn’t and how to fix it?

    Thanks!

Viewing 1 post (of 1 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".