Fancybox标题/标题

Question

我很新的网站设计，不能写js脚本。我的CSS是相当基础的。我使用FB 1.3.4，它一切正常，但我想改变图像标题/标题的格式。

我现在有这样的格式：
“图像的10这1是该图片的标题。[图片：史密斯]”

我想是这样的：
“这是标题此图片[照片：A史密斯]
图片1/10“

请注意，Image 1 of 10是换行了。我也希望像字幕的结束和[图片：·史密斯]之间多余的空格，虽然我不能工作，如何在这里显示它

我的脚本是：

<script type="text/javascript"> 
     $(document).ready(function() { 
      $(".fancybox").fancybox({ 
        'transitionIn'  : 'none', 
        'transitionOut'  : 'none', 
     'overlayColor'  : '#000000', 
     'overlayOpacity' : '0.90', 
        'titlePosition'  : 'over', 
        'titleFormat'  : function(title, currentArray, currentIndex, currentOpts) { 
        return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' of ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>'; 
        } 
     }); 
    }); 
    </script> 

我的CSS为的fancybox标题，在是：

.fancybox-title-over { 
position: absolute; 
bottom: 0; 
left: 0; 
color: #FFF; 
text-align: left; 

}

我知道我需要改变titlePosition到“里面”，但不能超越的！谁能帮我这个？非常感谢。

Answer 1

为了您titleFormat，替换该行：

'titleFormat' : function(title, currentArray, currentIndex, currentOpts) { 
return '<span id="fancybox-title-over">Image ' + (currentIndex + 1) + ' of ' + currentArray.length + (title.length ? ' &nbsp; ' + title : '') + '</span>'; 
} 

与此：

'titleFormat' : function(title, currentArray, currentIndex, currentOpts) { 
    return '<span>'+title+'<br />Image ' + (currentIndex + 1) + ' of ' + currentArray.length + (title.length ? ' &nbsp; ' : '') + '</span>'; 
} 

对于要额外的空间，你可以使用的字符代码 （每个额外的空间，你需要）title属性内

title="This is the caption for this image.   [Photo: a Smith]" 

还可以更改titlePosition到inside像

'titlePosition' : 'inside' 

和最后一个：我不会建议你设置标题与position: absolute。您可以更改text-align到left与内联CSS声明（您加载的fancybox CSS文件后），虽然有：

.fancybox-title-inside { 
text-align: left; 
}