[Plugin: Meteor Slides] Previous/next navigation arrows

Hi Andrew, thanks for trying my plugin. You can setup the navigation to always show, but you’ll have to add some customizations to your theme.

Add the Meteor Slides stylesheet and navigation images to your theme as explain in the FAQ.

Edit this rule in the stylesheet:

#meteor-slideshow ul.meteor-nav {
	display: none;
	list-style: none;
	margin: 0;
	padding: 0;
}

To look like this:

#meteor-slideshow ul.meteor-nav {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

Next create a “slideshow.js” file in your theme’s “js” folder and add this code to it:

var $j = jQuery.noConflict();

$j(document).ready(function() {

	$j(".meteor-slides").hover(function() {

		$j("ul.meteor-nav").css('display', 'block');

	}, function() {

		$j("ul.meteor-nav").css('display', 'block');

	});

});

Now edit your “header.php” file to load this JavaScript file, add this to the head below the wp_head() function:

<script type='text/javascript' src='<?php echo get_stylesheet_directory_uri(); ?>/js/slideshow.js'></script>

Now the navigation should never be hidden. Right now this is a bit more complicated than it needs to be, I’ll try to simplify this so it can be done with just CSS in the next version.

No problem Andrew, I have also needed to set up the nav to always show on a few of the projects that have done recently, so I’ll try to make this easier to do in the next version of Meteor Slides.

You’re welcome, thanks for trying Meteor Slides Ryan!

That sounds like a JavaScript conflict with your theme or another plugin, can you post a link to the page you are having this problem on?