我正在使用下面的代码来显示一个大的全屏滑块。我试图做的是将 .click 函数替换为定时事件,这样每个图像都会在一段时间(比如 7 秒)后发生变化,而不是在单击链接时发生变化。
已经为此工作了半天,但我仍然陷入困境,因此您可以提供的任何帮助将不胜感激。
谢谢
戴夫
jQuery(function($){
$(document).ready(function(){
$('.panorama .panorama-view').panorama360();
if ($('.panorama #thumbnails .thumbers a').length > 1) { // check if there are multiple panoramas
$('.panorama .panorama_controls a').click(function(ev) {
ev.preventDefault();
$active = $('.panorama #thumbnails .thumbers a.active');
if ($(this).hasClass('panorama_next')) {
if ($active.length == 0) $active = $('.panorama #thumbnails .thumbers a:last');
$next = $active.parent().next('li');
console.log($next);
if ($next.length > 0) { // check to see if it's not the first thumb
$('a:first',$next).trigger('click');
} else { // load last panorama in the thumb stack
$('.panorama #thumbnails .thumbers:first a').trigger('click');
}
}
else {
if ($active.length == 0) $active = $('.panorama #thumbnails a:first');
$prev = $active.parent().prev('li');
if ($prev.length > 0) { // check to see if it's not the first thumb
$('a:first',$prev).trigger('click');
} else { // load last panorama in the thumb stack
$('.panorama #thumbnails .thumbers:last a').trigger('click');
}
}
});
} else { // you can hide the controls because there is only one panorama loaded
$('.panorama .panorama_controls').hide();
}
$('.panorama #thumbnails .thumbers a').click(function(ev) {
ev.preventDefault();
if ($(this).hasClass('active')) return;
$('.panorama .preloader').show();
$('#thumbnails .thumbers a').removeClass('active');
$(this).addClass('active');
$('.panorama .panorama-view').hide();
$('.panorama .panorama-container').html($(this).next().html());
$('.panorama .panorama-view').panorama360({ sliding_direction: 0 });
$('h1.main-header').html($(this).data("title"));
$('.main-desc').html($(this).data("description"));
});
$('.panorama .hotspot').fancybox({
padding : 0,
fitToView : true,
mouseWheel : false,
maxWidth: '600',
minHeight: '400',
autoCenter: true,
closeClick : false
});
var pictures = [],
$thumbnails = $( '#thumbnails' );
// jScrollPane
$thumbnails.find( 'ul' ).width( function() {
var totalWidth = 0;
$( this ).find( 'li' ).each( function() {
totalWidth += $( this ).outerWidth( true );
});
return totalWidth;
});
$thumbnails.jScrollPane();
var jScrollPaneApi = $thumbnails.data( 'jsp' );
$( window ).bind( 'resize', function() {
jScrollPaneApi.reinitialise();
});
}); // END doc ready
}); // END function