[Plugin: WP Orbit Slider] Make it not responsive…?

  • lullie

    (@lullie)


    11 years, 7 months ago

    Hi!
    Just wanted to say that I love the slider! It’s one of the best slider plugin.

    I’m trying to make the slider not responsive, because my website will have a special version for mobile, and a standard one, which is only for web — the one I’m working on right now.

    I need my slider image to be exactly 1600px wide and centered on screen, so, if the user has a lower screen resolution (such as 1024×768), he/she would see only the middle of the slider (just like Rovio’s slider, at http://www.rovio.com). Does anybody know how I could achieve this via CSS?

    I’ve tried to edit “custom.css”, but all I could do was make the slider’s width and height fixed. Good! But the images didn’t get centered :/
    Any help is welcome!
    Thanks!

    http://wordpress.org/extend/plugins/wp-orbit-slider/

Viewing 1 replies (of 1 total)
  • Thread Starter lullie

    (@lullie)

    11 years, 7 months ago

    oh, I partially did it. :’D (sorry for being so noob!)
    The bullets/nav/prev links are centering in all screen resolutions. Now I wonder what I should do to make the slider’s images center in lower screen resolutions too (I mean, < 1600px). For me (my resolution is 1920×1080), it’s centered.

    The key points I found until now on custom.css:

    #orbit-inside { width:1600px !important; margin:0 auto; }

    /* this is the main wrapper. I saw it through firebug add-on and declared a width to it */
    div.custom-slider { width:100%; margin:0 auto; }

    /* IMPORTANT! Keep the div.orbit-wrapper width = 100%, or the bullets/nav/prev links won’t center in lower screen resolutions. */
    div.orbit-wrapper { width:100% !important; height: 1px; position: relative; }

    thanks!

Viewing 1 replies (of 1 total)
  • The topic ‘[Plugin: WP Orbit Slider] Make it not responsive…?’ is closed to new replies.