So first off I have basically no working knowledge of javascript or Jquery. Second off I have tried to look up answers to this and tried a few things but nothing worked for me.
My slides seem to change every 6 or 7 seconds. I want to make each slide last longer. Maybe about 12 seconds before changing. I have tried changing the speed and timeout values and adding mouse overs for a pause feature but nothing has worked.
This is the code built into the web template. Top half looks to be for admin editing, while bottom is the general page view. Any help with this is greatly appreciated.
jQuery.noConflict();
jQuery(document).ready(function($){
// Checks for Admin to apply fixes for backend
if ( $('#adminbar #toolbar').length ) {
$('#features').cycle({
fx: 'scrollRight',
speed: 100,
next: '#next',
prev: '#prev',
timeout: 0
});
$("#controls").show();
$("ul#featuredNav").css({
'margin-top': '-38px'
});
$("ul#featuredNav li").css({
'margin': '-20px 0 90px',
'padding': '0 0 0 20px'
});
$("#featuredWrapper").css({
'margin': '0 0 80px'
});
}
else {
$('#features').cycle({
fx: 'scrollRight',
pager: '#featuredNav',
speed: 500,
timeout: 6000,
pagerAnchorBuilder: function(idx, slide) {
// return selector string for existing anchor
return '#featuredNav li:eq(' + idx + ')';
},
updateActivePagerLink: function(pager, currSlideIndex) {
$(pager).find('li').removeClass('activeTab')
.filter('li:eq('+currSlideIndex+')').addClass('activeTab');
}
});
$("#controls").hide();
}
});
Change
timeout: 6000,
to
timeout: 12000,
then clear your browser and site caches.