格式化FancyBox的标题 [英] Formatting a title for FancyBox

问题描述

我一点也不了解javascript，但是我正在尝试格式化正在使用FancyBox显示的图片的标题/标题.在<a>标记的title属性中，我写出了个人姓名，专业和职业.我希望将他们的姓名显示在一行上，然后将专业和职业放在下一行.例如:

I don't know javascript at all, but I am trying to format my titles/captions for my pictures that are being displayed using FancyBox. In my title attribute in my <a> tag, I have an individuals name, major, and career written out. I would like to have their Name displayed on one line, and then major and career can be on the next. For example:

Joe Smith，BS '02
专业:企业社会责任，职业:零售经理

Joe Smith, BS '02
Major: CSR, Career: Retail Manager

我知道我不能在title=""中输入一个中断，所以在我的javascript函数中有没有简单的方法可以做到这一点?我希望我可以将我的id属性设置为该人的名字，然后在我的函数中调用它，然后将标题设置为其余人，但这似乎不起作用.

I know I can't enter in a break in the title="", so is there an easy way to do this in my javascript function? I was hoping that I could just set my id attribute to the person's name and call it in my function, and then set the title to the rest, but that doesn't seem to work.

这是当前运行良好的函数，只需要以某种方式拆分我的标题即可:

Here is the current function that works fine, just need to split my title somehow:

("a[rel=cdfs]").fancybox({

            'transitionIn'      : 'elastic',
            'transitionOut'     : 'elastic',
            'titlePosition'     : 'over',
            'titleFormat'       : function(title, currentArray, currentIndex, currentOpts) {
                return '<span id="fancybox-title-over">' + (title.length ? ' &nbsp; ' + title : '') + '<br/><p align="right" >Image ' + (currentIndex + 1) + ' / ' + currentArray.length + '</p></span>';
            }
        });

感谢您的任何想法或意见！我很感激:)

Thank you for any ideas or input! I appreciate it :)

推荐答案

您可以将标题分成两行:

You can break your title in two lines like that:

'titleFormat': function(title, currentArray, currentIndex, currentOpts){
temp=title.split('|');
if(!temp[1]){temp[1]=""};
return '<div>'+temp[0]+'</div><div>'+temp[1]+'</div>'

},

如您所见，我通过添加'|'来拆分标题字符，需要将其添加到标题文本中，但是您可以采用其他方法.另外，在这个简单的示例中，背景等格式丢失了，但是您可以轻松地对其进行修复.

As you can see I am spliting the title by addition of '|' character, which need to be added to your title text, but you can do it differently. Also, in this simple example the formatting such as background etc is lost but that you can fix it easily.

祝你好运

K

这篇关于格式化FancyBox的标题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！