fancybox在圖像的右側有多個標題

我需要在圖像的右側顯示圖像標題，日期和鏈接。fancybox在圖像的右側有多個標題

默認的fancybox與此類似example

東西讓我們幾個選項像inside，outside，top但不left或圖像的right側。並與導航按鈕<>

$(".fancybox").fancybox({ 
    helpers : { 
     title: { 
      type: 'inside', 
      position: 'top' 
     } 
    }, 
    nextEffect: 'fade', 
    prevEffect: 'fade' 
});

有沒有像在圖像下方 enter image description here

小提琴例如如圖一個方面，我們可以做到這一點http://jsfiddle.net/JYzqR/

來源

2014-10-08 Learning

這可能會幫助你需要：http://jsfiddle.net/svsdx/ – artuc 2014-10-08 13:05:54

可以使用的fancybox TPL（模板）選項並添加關於像afterLoad這樣的回調信息，如下所示：

$(".fancybox").fancybox({ 
    helpers : { 
     title: { 
      type: 'inside', 
      position: 'top' 
     } 
    }, 
    nextEffect: 'fade', 
    prevEffect: 'fade', 
    afterLoad: function() { 
     var html = '<span>Date, File Type, Download</span>'; 
     $('.fancybox-sidebar').append(html); 
    }, 
    tpl: { 
     wrap  : '<div class="fancybox-wrap" tabIndex="-1"><div class="fancybox-skin"><div class="fancybox-outer"><div class="fancybox-inner"></div><div class="fancybox-sidebar"></div></div></div></div>' 
    } 
});

DEMO

來源

2014-10-08 13:08:45

我試過了，但文字沒有顯示在圖像的右側示例http://jsfiddle.net/8bqynmjh/2/ 。除此之外，它還增加了小屏幕尺寸的滾動條。 – Learning 2014-10-09 06:47:43

這只是爲了讓divs可以在fancybox裏面，你可以很容易地將元素設計成你想要的樣式，你必須爲這個 – 2014-10-09 06:55:12

[JSFIDDLE]（http：// jsfiddle）添加poper CSS。 net/hypzo/8bqynmjh/5 /）我意識到這樣做更容易做這樣的事情，但是如果你更喜歡其他佈局，將工作以及 – 2014-10-09 07:11:17

fancybox在圖像的右側有多個標題

回答

相關問題