设置 FancyBox 标题的格式

发布于 2024-11-08 01:54:53 字数 951 浏览 0 评论 0原文

我根本不懂 javascript，但我正在尝试格式化使用 FancyBox 显示的图片的标题/说明文字。在标记的标题属性中，我写下了个人姓名、专业和职业。我希望将他们的名字显示在一行上，然后专业和职业可以显示在下一行上。例如：

乔·史密斯，BS '02
专业：企业社会责任，职业：零售经理

我知道我无法在 title="" 中输入中断，那么有没有一种简单的方法可以在我的 javascript 函数中执行此操作？我希望我可以将 id 属性设置为该人的姓名并在我的函数中调用它，然后将标题设置为其余部分，但这似乎不起作用。

这是当前运行良好的功能，只需要以某种方式分割我的标题：

("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>';
            }
        });

感谢您的任何想法或输入！我很感激:)

原文

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
Major: CSR, Career: Retail Manager

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 ? '   ' + title : '') + '<br/><p align="right" >Image ' + (currentIndex + 1) + ' / ' + currentArray.length + '</p></span>';
            }
        });

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

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

说好的呢 2024-11-15 01:54:54

您可以将标题分成两行，如下所示：

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

},

如您所见，我通过添加“|”来分割标题字符，需要添加到标题文本中，但您可以采用不同的方式。此外，在这个简单的示例中，背景等格式丢失了，但您可以轻松修复它。

好运

祝你

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.

good luck

回复收藏 0 原文

~没有更多了~