【问题标题】:Help need to merge two functions for jquery cycle?帮助需要为jquery循环合并两个函数?
【发布时间】:2010-07-20 02:40:36
【问题描述】:

我有两个函数想在我的前回调中使用 jquery 循环。一个在用户循环浏览时滑动寻呼机,另一个将图像水平和垂直居中在包含的 div 内。两者单独工作都很好,但我似乎可以让它们在 before 回调中一起工作。我有一个示例,显示了我所拥有的内容,但在 after 回调中设置了幻灯片功能。 - http://tinyurl.com/27pmzj5

这是我目前的代码。

$(function() {

$('#photo-slideshow').cycle({ 
    timeout: 0,
    next: '#next-btn', 
    prev: '#prev-btn',
    before: align,
    after: slide,
    pager:  '#nav', 
    // callback fn that creates a thumbnail to use as pager anchor 
    pagerAnchorBuilder: function(idx, slide) { 
        return '<li><a href="#"><img src="' + slide.src + '" width="75" height="75" /></a></li>'; 
    } 
});


//Play and Pause
$('#pause-btn').click(function() { $('#photo-slideshow').cycle('pause'); return false; });
$('#play-btn').click(function() { $('#photo-slideshow').cycle('resume'); return false; });


//Align Image       
function align(curr,next,opts) {

    //center the image
    var $slide = $(next);
    var w = $slide.outerWidth();
    var h = $slide.outerHeight();
    $slide.css({
        marginTop: (800 - h) / 2,
        marginLeft: (800 - w) / 2
    });


    //centers the DIV vertically!!!!    
    var divHeight = 800;
    var theImageHeight = $slide.outerHeight();
    var newTopMargin = (divHeight - theImageHeight) / 2;
    if(theImageHeight > 800){
        $('#photo-slideshow').css({
            marginTop: newTopMargin
        });
    }


    //Adds caption and credit line
    $('#photo-info').html(this.title) 
        .append('<p>' + "Credit: "  + this.alt + '</p>'); 


}


//Slide Pager
function slide(a,b,c,d) {
    if ( c.currSlide < c.slideCount-3 || c.nextSlide == 0 ){
            var p = ( c.nextSlide - 2 < 0 ) ? 0 : -(75*(c.nextSlide-2));
            $("#nav").animate({"left":p+"px"},500);
        }

    }

}); 

非常感谢任何帮助让这两个都在 before 回调上工作!

【问题讨论】:

    标签: jquery function cycle jquery-cycle


    【解决方案1】:

    也许我误解了这个问题,但你不能这样做:

    before: function(a, b, c, d) {
      align(a, b, c);
      slide(a, b, c, d);
    }
    

    ??换句话说,只需将“之前”处理程序设置为调用其他两个函数的函数。如果你愿意,你可以把它写成一个单独的函数:

    function callBoth(a, b, c, d) {
      align(a, b, c, d);
      slide(a, b, c, d);
    }
    

    为了让它不那么难看,你可以这样做:

    function callBoth() {
      align.apply(this, arguments);
      slide.apply(this, arguments);
    }
    

    【讨论】:

    • 啊,有道理!非常感谢您的快速帮助,非常感谢!
    猜你喜欢
    • 1970-01-01
    • 2011-12-06
    • 1970-01-01
    • 1970-01-01
    • 2013-05-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2012-07-29
    相关资源
    最近更新 更多