У меня проблемы, и мне нужна помощь.У меня в основном есть карусельная (прокручивающаяся) галерея с тремя изображениями.Вы видите только одно изображение за раз, и чтобы увидеть следующее изображение, вам нужно щелкнуть ссылку, которая относится к этому изображению, или щелкнуть само текущее изображение, чтобы увидеть следующее изображение.Это заставило бы его прокрутить одно изображение, и li, содержащий изображение, получит класс 'active'.
Меня попросили добавить функцию автопрокрутки, и я немного застрял?
Они, как правило, хотят, чтобы он автоматически прокручивал 1 изображение каждые 2/3 секунды, если пользователь не использует ссылки для прокрутки галереи.
Любая помощь будет ЦЕННО признательна :)мне нельзя использовать плагин или что-либо еще, я должен изменить текущий код: S
Если честно, я знаю, что это, вероятно, безнадежный случай, но если есть кто-то, кто мог бы решитьэто было бы очень полезно.
Функциональность прокрутки / галереи направлена вниз.
$(document).ready(function() {
Cufon.replace('.section-1 h2, .section-2 h3, .follow h3, .follow h4, .overlay h3, .overlay h4');
$.friends.people.init();
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_endRequest($.friends.people.overlay.request);
});
$.friends.people = {
init: function() {
this.slide_anchors();
this.gallery.init();
$.friends.tooltips.init();
this.overlay.init();
this.label_value.init();
},
slide_anchors: function() {
$('a.down, a.up').click(function(event) {
event.preventDefault();
var speed = 400;
var target = $(this).attr('href');
var dest = $(target).offset().top;
$('html:not(:animated), body:not(:animated)').animate(
{ scrollTop: dest },
speed,
function() {
window.location.hash = target;
}
);
return false;
});
},
overlay: {
email_btn: null,
sms_btn: null,
init: function() {
this.close();
$('a.sms').click(function() {
__doPostBack($.friends.people.overlay.sms_btn, '');
$('.overlay-wrap').fadeIn(250, function(){$.friends.people.label_value.init()});
return false;
});
$('a.email').click(function() {
__doPostBack($.friends.people.overlay.email_btn, '');
$('.overlay-wrap').fadeIn(250, function(){$.friends.people.label_value.init()});
return false;
});
$('.section-2 a.sms, .section-2 a.email').click(function() {
$('a.up').click();
return false;
});
},
close: function() {
$('a.overlay-close').click(function() {
$('.overlay-wrap').fadeOut(250);
return false;
});
},
request: function() {
$.friends.people.label_value.init();
$.friends.people.overlay.close();
Cufon.replace('.overlay h3, .overlay h4');
$.friends.external_links();
}
},
label_value: {
init: function() {
$('.labelValue').each(function() {
var text = $(this).text().replace(/^\s+|\s+$/g, '');
var $textbox = $('#'+$(this).attr('for'));
if($textbox.val() == "") $textbox.val(text);
$textbox.focus(function() {
if($(this).val() == text) $(this).val("");
});
$textbox.blur(function() {
if($textbox.val() == "") $textbox.val(text);
});
});
}
},
gallery: {
i: null,
width: null,
moving: false,
speed: 500,
init: function() {
this.i = $('.section-2 .col-2 .images img').length;
if (this.i > 1) {
this.resize_div();
this.add_nav();
}
},
resize_div: function() {
this.width = $('.section-2 .col-2 .images img:first').width();
$('.section-2 .col-2 .images').width((this.i * this.width) + 'px');
},
add_nav: function() { /* rewrite this with .each() */
var html = '<ul class="image-nav">';
for (x = 0; x < this.i; x++) {
html = html + '<li><a href=""></a></li>';
}
html = html + '</ul>';
$('.section-2 .col-2').append(html).find('li:first').addClass('active');
$('.section-2 .col-2 ul.image-nav li a').click(function() {
if (!$.friends.people.gallery.moving) {
$.friends.people.gallery.moving = true;
$.friends.people.gallery.scroll($('.section-2 .col-2 ul.image-nav li a').index(this));
}
return false;
});
$('.section-2 .col-2 .images img').click(function() {
if (!$.friends.people.gallery.moving) {
$.friends.people.gallery.moving = true;
var current = $('.section-2 .col-2 .images img').index(this);
if (current >= ($('.section-2 .col-2 .images img').length - 1)) {
var target = 0; console.log('asd');
} else {
var target = current + 1;
}
$.friends.people.gallery.scroll(target);
}
return false;
});
},
scroll: function(img) {
$('.section-2 .col-2 ul.image-nav li').removeClass('active');
$('.section-2 .col-2 ul.image-nav li:eq(' + img + ')').addClass('active');
$('.section-2 .col-2 .images').animate(
{ marginLeft: -($.friends.people.gallery.width * img) },
$.friends.people.gallery.speed,
function() {
$.friends.people.gallery.moving = false;
}
);
}
}
}