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