Mensa Theme – Slideshow issue

This is happening because of the Javascript below which is located in wp-content/themes/mensa/assets/js/scripts.js

function showVideo(id) {
	document.write("<object width=\"274\" height=\"225\"><param name=\"movie\" value=\"https://www.youtube.com/v/"+id+">&hl=en&fs=1\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"https://www.youtube.com/v/"+id+"&hl=en&fs=1\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"274\" height=\"225\"></embed></object>");
}

$(function() {

		$('.items').cycle({
			fx: 'fade',
			speed: 700,
			timeout: 1000000000,
			next: '.next',
			prev: '.prev'
		});

	});

This javascript is targeting a div which has the class “items” in your index file. Because both slideshow boxes are have the class “items” javascript controls them both. To eleminate this problem just rename the two elements say for example have the top slideshow with a class of “itemsheader” and the bottom with “itemsfooter” you would then add a function in the javascript file above. Using the naming scheme I mentioned your scripts.js file should look like this:

function showVideo(id) {
	document.write("<object width=\"274\" height=\"225\"><param name=\"movie\" value=\"https://www.youtube.com/v/"+id+">&hl=en&fs=1\"></param><param name=\"allowFullScreen\" value=\"true\"></param><param name=\"allowscriptaccess\" value=\"always\"></param><embed src=\"https://www.youtube.com/v/"+id+"&hl=en&fs=1\" type=\"application/x-shockwave-flash\" allowscriptaccess=\"always\" allowfullscreen=\"true\" width=\"274\" height=\"225\"></embed></object>");
}

$(function() {

		$('.itemsheader').cycle({ //Note that this has changed from .items to .itemsheader
			fx: 'fade',
			speed: 700,
			timeout: 1000000000,
			next: '.next',   //on a similar note you may need to add some text after this class name
			prev: '.prev'	// and this so that it's different from the footer controls
		});

	});

$(function() {

		$('.itemsfooter').cycle({
			fx: 'fade',
			speed: 700,
			timeout: 1000000000,
			next: '.next',
			prev: '.prev'
		});

	});

Remember you would need to rename the class of the divs surrounding the slideshow in your actual homepage accordingly.

thanks