WordPress.org

Support

Support » Plugins and Hacks » Meteor Slides » [Resolved] [Plugin: Meteor Slides] Centering buttons

[Resolved] [Plugin: Meteor Slides] Centering buttons

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author Josh Leuze

    @jleuze

    Are you referring the paged navigation below the slideshow? These are left aligned by default to work with any slideshow quantity and dimensions.

    But you can change the position to center them for your own slideshow where you know the quantity and width. You just need to take a screenshot of your site and measure how wide the paged buttons are, subtract that from your slideshow width and divide by two. Then you can change the left position of the paged buttons. Like if the buttons are 20px wide and the slideshow is 400px wide, set “left” to “190px” like this:

    .meteor-buttons {
        bottom: 5px;
        left: 190px;
        margin: 0;
        position: absolute;
        z-index: 50;
    }

    Thanks, but I had to convert to ems because in pixels resulted with a fraction, it worked great thanks for your advise.

    Plugin Author Josh Leuze

    @jleuze

    No problem, percentages are useful sometimes too, if the width isn’t consistent.

    JLeuze, thanks so much for this plugin. I use it all the time. I was trying to center the nav buttons myself and I think this will allow you to do it without knowing ahead of time the number of buttons:

    .meteor-slides .meteor-buttons {
        bottom: 30px;
        height: 9px;
        margin: 0;
        padding: 6px 0 0;
        position: absolute;
        width: 100%;
        z-index: 999;
        text-align:center;
    }
    .meteor-buttons a {
        background: url('images/buttons.png') no-repeat bottom left;
        display: inline-block;
        width: 9px;
        height: 9px;
        margin: 0 2px;
        outline: none;
        text-indent: -9999px;
    }

    Plugin Author Josh Leuze

    @jleuze

    @ghosttoast Thanks for sharing, I’ll try that out!

    Thanks GhostToast
    works a treat for me

    Hi GhostToast…and Marklcm – where exactly do you insert that code? FYI, I put the slider on my website by inserting the widget into the body of a page as opposed to using code. Thanks!

    Plugin Author Josh Leuze

    @jleuze

    You would add that code using a custom stylesheet in your theme.

    Thanks JLeuze!

    Plugin Author Josh Leuze

    @jleuze

    No problem!

    Hi,

    What if I have multiple slideshows each with a different number of images?

    Thanks in advance!

    Ah nevermind, I found out how. If anyone was wondering, this is for a 960px site:

    #meteor-buttonsSLIDESHOWNAME {
    width:260px !important;
    left: 455px !important;
    }

    The 260px width is to prevent #meteor-buttons’ original 100% width from extending off the page and creating a horizontal scrollbar.

    Plugin Author Josh Leuze

    @jleuze

    Thanks for sharing!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘[Resolved] [Plugin: Meteor Slides] Centering buttons’ is closed to new replies.
Skip to toolbar