I don't believe so... thank you for your help with that part however I do have another issue.
I've created a custom HTML slideshow in position 'showcase' and the code also appears to be conflicting with the drop down animation. I'm sure it has something to so with "<s-cript src="
http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>" as when I remove this the drop down works, but my slideshow breaks.
Is it possible for you to take another look and suggest possible solutions, if there are any?
Here's the slideshow script...
<s-cript src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<s-cript src="http://malsup.github.com/jquery.cycle2.js"></script>
<s-tyle>
.cycle-slideshow { max-width: 1100px; float:left; margin: 0; z-index:10; }
#container { margin: auto; float:left; margin-bottom:60px; }
</style>
<div id="container">
<div class="cycle-slideshow" data-cycle-reverse="true" data-cycle-timeout="0" data-cycle-speed="2000" data-index="1"><img src="/images/slideshow/1.jpg" /> <img src="/images/slideshow/2.jpg" /> <img src="/images/slideshow/3.jpg" /> <img src="/images/slideshow/4.jpg" /> <img src="/images/slideshow/5.jpg" /></div>
<div class="cycle-slideshow" data-cycle-timeout="0" data-cycle-speed="2000" data-index="2"><img src="/images/slideshow/6.jpg" /> <img src="/images/slideshow/7.jpg" /> <img src="/images/slideshow/8.jpg" /> <img src="/images/slideshow/9.jpg" /> <img src="/images/slideshow/10.jpg" /></div>
<div class="cycle-slideshow" data-cycle-timeout="0" data-cycle-speed="2000" data-cycle-reverse="true" data-index="3"><img src="/images/slideshow/11.jpg" /> <img src="/images/slideshow/12.jpg" /> <img src="/images/slideshow/13.jpg" /> <img src="/images/slideshow/14.jpg" /> <img src="/images/slideshow/15.jpg" /></div>
</div>
<s-cript>
(function() {
"use strict";
var slideshows = $('.cycle-slideshow');
// optional: sort the slideshow collection based on the value of the data-index attribute
Array.prototype.sort.call( slideshows, function(a, b) {
a = $(a).data('index'), b = $(b).data('index');
return a < b ? -1 : a > b ? 1 : 0;
});
// bind to cycle-after to trigger next slideshow's transition
$('#container').on('cycle-after', function(e) {
var index = slideshows.index(e.target);
transitionNext(index);
});
// trigger the initial transition after 1 second
setTimeout(transitionNext, 1000);
function transitionNext( index ) {
if (index === undefined || index == slideshows.length -1 )
index = 0;
else
index++;
slideshows.eq(index).cycle('next');
}
})();
</script>