Javascript 我如何在另一个JCarousel中控制一个JCarousel?
使用JCarousel,我目前在另一个旋转木马中有一个旋转木马,我可以通过单击我在外部旋转木马上创建的播放按钮触发该旋转木马开始播放幻灯片。这些都是动态加载的 我想让内部旋转木马停止设置动画,并在单击以更改外部旋转木马的幻灯片时返回其原始加载位置Javascript 我如何在另一个JCarousel中控制一个JCarousel?,javascript,jquery,jcarousel,Javascript,Jquery,Jcarousel,使用JCarousel,我目前在另一个旋转木马中有一个旋转木马,我可以通过单击我在外部旋转木马上创建的播放按钮触发该旋转木马开始播放幻灯片。这些都是动态加载的 我想让内部旋转木马停止设置动画,并在单击以更改外部旋转木马的幻灯片时返回其原始加载位置 Here is what I have currently for manipulating JCarousel: //outer carousel $('#carousel').jcarousel({ auto: 0, wrap: '
Here is what I have currently for manipulating JCarousel:
//outer carousel
$('#carousel').jcarousel({
auto: 0,
wrap: 'circular',
scroll: 1,
initCallback: carousel_initCallBack,
itemVisibleInCallback: {
onBeforeAnimation: gallerycarousel_itemfirst
}
// Info Box
$('.info').click(function() {
var itemid = $(this).attr('id').substring(5);
$.ajax({
url: 'php/get_case_studies.php?item=' + itemid,
dataType: 'json',
success: function(data) {
var infobox = $('#box_info' + data.data[0].id)
infobox.html('');
var content = '<div class="main_sec">'+data.data[0].main_desc+'</div><div class="sec_sec">'+data.data[0].sec_desc+'</div><div class="visit"><span class="box_num"><img src="img/visitor.png" alt="#" /> Visitors:</span>'+data.data[0].visitors+'</div><div class="avg"><span class="box_num"><img src="img/time.png" alt="#"/> Average time on site:</span>'+ data.data[0].avg_time +'</div><a href="'+ data.data[0].url +'" target="_blank" class="link"></a>';
infobox.append(content);
$('.box_info').animate({left: '0px'}, 200);
}
});
});
function carousel_initCallBack(carousel) {
carousel.clip.hover(function() {
$('.gallery_control').stop().animate({"top": "454px"}, 200);
carousel.stopAuto();
}, function() {
$('.gallery_control').stop().animate({"top": "524px"}, 200);
$('.box_info').animate({left: '-302px'}, 200 );
carousel.startAuto();
});
$('#gallerycarousel_controls .btn_right').click(function() {
carousel.next();
return false;
});
$('#gallerycarousel_controls .btn_left').click(function() {
carousel.prev();
return false;
});
$('.grid').click(function() {
$('.gallery_control').animate({"top": "524px"}, 200);
$('#grid_view').fadeIn('slow');
carousel.stopAuto();
$('#grid_view').mouseleave(function() {
$(this).fadeOut('slow');
carousel.startAuto();
});
});
$('#carousel_slides .btn_item').click(function() {
carousel.scroll($.jcarousel.intval($(this).attr('id')));
$('#grid_view').fadeOut('slow');
$('.gallery_control').animate({"top": "454px"}, 200);
return false;
});
//this is the play button which generates and starts the inner carousel
$('.play').click(function() {
var itemid = $(this).attr('id').substring(5);
$('#int_carousel' + itemid).load('get_slideshow.php?slideshow&item=' + itemid, function() {
$('#int_carousel' + itemid).jcarousel({
auto: 3,
wrap: 'circular',
scroll: 1
});
});
});
}
上面的方法不起作用,因为我已经尝试过了,这可能不会将内部旋转木马恢复到幻灯片的原始位置
我去过多个不同的论坛,一直在互联网上搜索我能搜索到的任何地方,但我仍然找不到任何可靠的帮助或帮助。我在这方面急需帮助,因为我已经没有选择了。如果有人能帮我,我会非常感激的。我对网络开发还是新手,需要指导 伟大的斯科特!你可能正在打破时空连续体!“旋转木马”听起来是个坏主意。假设它们都是水平或垂直的。
$('#gallerycarousel_controls .btn_right').click(function() {
$('#int_carousel' + itemid).stopAuto();
});