• isign4jc

    (@isign4jc)


    I’m just wondering if it’s possible to have multiple layers in the slideshow? I need two static “buttons” that will link to their respective pages that stay on top of the slideshow. Then, behind those will be a rotating slideshow that is not clickable. Is this possible with this plugin?

    http://wordpress.org/extend/plugins/meteor-slides/

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

    (@jleuze)

    Sure, you can do that. If you don’t add links to the slides they won’t be clickable.

    To position the buttons above the slideshow, put the slideshow template tag and buttons inside a container to wrap around the whole thing like this:

    <div id="meteorslides-wrapper">
    	<?php if ( function_exists( 'meteor_slideshow' ) ) { meteor_slideshow(); } ?>
    	<a class="meteorslides-button meteorslides-button-1" href="#">Button 1</a>
    	<a class="meteorslides-button meteorslides-button-2" href="#">Button 2</a>
    </div><!-- #meteorslides-wrapper -->

    To style that, you’ll need to position the buttons absolutely with a high z-index to layer them above the slideshow, and set the position of the #meteor-slides-wrapper container to relative so that the buttons stay within that container:

    #meteor-slides-wrapper {
    	height: (Same as slideshow);
    	position: relative;
    	width: (Same as slideshow);
    }
    
    .meteorslides-button {
    	bottom: 10px;
    	position: absolute;
    	z-index: 9999;
    }
    
    .meteorslides-button-1 {
    	right: 100px;
    }
    
    .meteorslides-button-2 {
    	right: 50px;
    }

    You can change the bottom and right values of the buttons to position them exactly where you want them.

    Thread Starter isign4jc

    (@isign4jc)

    I’ll give that a shot. Thank you so much for your quick response!!

    Thread Starter isign4jc

    (@isign4jc)

    It’s working beautifully! Thanks so much!

    Plugin Author Josh Leuze

    (@jleuze)

    No problem!

    Thread Starter isign4jc

    (@isign4jc)

    Unrelated question, but how do I rearrange the order of the slides. Seems like it should be obvious, but I can’t find it.

    Thread Starter isign4jc

    (@isign4jc)

    Sorry..in the midst of trying to finish this and had a couple other questions…Does z index work on mobile devices? I set the z-index to show perfectly in Firefox, but it is off in Safari. Is there a way to tell Safari to add more pixels so that it’s aligned correctly?

    Plugin Author Josh Leuze

    (@jleuze)

    The slides are sorted chronologically like blog posts, so you can change the published date to sort them, or there are plugins that will add drag and drop sorting functionality.

    The z-index layering should work on every browser and device. Are the buttons layered incorrectly, or positioned in the wrong spot? I can take a look if you want to post a link.

    Thread Starter isign4jc

    (@isign4jc)

    The buttons were in the wrong spot, but we were able to fix the positioning now. Realized we had to set the buttons images to “relative” in the CSS.

    Plugin Author Josh Leuze

    (@jleuze)

    Cool, good to hear you got it figured out.

Viewing 9 replies - 1 through 9 (of 9 total)
  • The topic ‘[Plugin: Meteor Slides] Multiple layers?’ is closed to new replies.