Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/77.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery Fancybox向标题添加左/右按钮_Jquery - Fatal编程技术网

Jquery Fancybox向标题添加左/右按钮

Jquery Fancybox向标题添加左/右按钮,jquery,Jquery,我现在只需要帮助完成这项工作,在标题中显示prev/next按钮的if语句不能正常工作 通过向标题添加额外的左/右按钮来定制标准fancybox,如下图所示: 这是我到目前为止所做的,它增加了图像计数。是否可以将按钮添加到此中,使其更易于设置样式 $("a.fancybox").fancybox({ 'padding' : 5, 'overlayShow' : true, 'speedIn' : 600,

我现在只需要帮助完成这项工作,在标题中显示prev/next按钮的if语句不能正常工作

通过向标题添加额外的左/右按钮来定制标准fancybox,如下图所示:

这是我到目前为止所做的,它增加了图像计数。是否可以将按钮添加到此中,使其更易于设置样式

 $("a.fancybox").fancybox({
            'padding' : 5,
            'overlayShow' : true,
            'speedIn' : 600,
            'speedOut' : 500,
            'transitionIn': 'elastic',
            'transitionOut': 'elastic',
            'easingIn' : 'easeOutBack',
            'easingOut' : 'easeInBack',
            'titlePosition' : 'inside',
            'titleFormat' : function(title, currentArray, currentIndex, currentOpts) { 
                 $title = '';
                 var current = currentIndex + 1;
                 if(current >= currentArray.length){
                     $title += '<a href="javascript:;" onclick="$.fancybox.prev();" id="fancybox-prev-btn"></a>';
                 }
                 if(current <= currentArray.length){
                     $title += '<a href="javascript:;" onclick="$.fancybox.next();" id="fancybox-next-btn"></a>';
                 }
                 $title += '<span class="fancybox-title">' + title + '<span class="fancybox-title-count">(image ' + (currentIndex + 1)  + ' of ' + currentArray.length + ')</span></span><br class="clearBoth"/>';
                 return $title;
            } 
        });
$(“a.fancybox”).fancybox({
“填充”:5,
“叠加显示”:正确,
“speedIn”:600,
“加速输出”:500,
“transitionIn”:“弹性”,
“transitionOut”:“弹性”,
“easingIn”:“easeautback”,
“easingOut”:“easeInBack”,
“标题位置”:“内部”,
“标题格式”:函数(标题、currentArray、currentIndex、currentOpts){
$title='';
无功电流=电流指数+1;
如果(当前>=currentArray.length){
$title+='';
}
如果(当前请尝试以下方法():

Javascript

$(selector).fancybox({

    beforeLoad: function() {
        var title = '';
        if (this.index > 0) {
            title += '<a href="#" onclick="$.fancybox.prev();return false;" id="fancybox-prev-btn"></a>';
        }
        if (this.index < this.group.length - 1) {
            title += '<a href="#" onclick="$.fancybox.next();return false;" id="fancybox-next-btn"></a>';
        }
        title += '<span class="fancybox-title">' + $(this.element).find('img').attr('alt') + '<span class="fancybox-title-count">(image ' + (this.index + 1) + ' of ' + this.group.length + ')</span></span><br class="clearBoth"/>';
        this.title = title;
    }

});
$(选择器).fancybox({
加载前:函数(){
var title='';
如果(this.index>0){
头衔+='';
}
if(this.index;
this.title=标题;
}
});

再次感谢您,我花了很长时间在循环中更改if语句。我同意使用“#”而不是javascript。有没有可能在最新版本的Fancybox(v2.1.0)中对此进行检查?Opps try…标题正确地从img alt属性获得。
#fancybox-prev-btn, #fancybox-next-btn {
    position: absolute;
    top: 0;
    width: 30px;
    height: 30px;
    margin-left: -50px;
    cursor: pointer;
    z-index: 1102;
    display: block;
    background-image: url('http://i56.tinypic.com/s5wupy.png');
}

 #fancybox-prev-btn {
    background-position: -40px -30px;
    left: 0;
}
#fancybox-next-btn {
    background-position: -40px -60px;
    left: 30px;
}
$(selector).fancybox({

    beforeLoad: function() {
        var title = '';
        if (this.index > 0) {
            title += '<a href="#" onclick="$.fancybox.prev();return false;" id="fancybox-prev-btn"></a>';
        }
        if (this.index < this.group.length - 1) {
            title += '<a href="#" onclick="$.fancybox.next();return false;" id="fancybox-next-btn"></a>';
        }
        title += '<span class="fancybox-title">' + $(this.element).find('img').attr('alt') + '<span class="fancybox-title-count">(image ' + (this.index + 1) + ' of ' + this.group.length + ')</span></span><br class="clearBoth"/>';
        this.title = title;
    }

});