的fancybox，自開放過渡

Question

有誰知道你是怎麼打開的fancybox使用自定義開放的過渡：

http://fancyapps.com/fancybox/

即時通訊尋求實現類似轉變的例子在這裏找到：

http://www.zurb.com/playground/reveal-modal-plugin

我喜歡揭示插件，但它沒有得到我需要fancyBox爲新項目做的一些功能

非常感謝，

山姆

Answer 1

的fancybox可以有相同的開放效果的樣品中你提供了但不是相同的收盤效果。

要達到同樣的效果開盤，試試這個選項：

openMethod : 'changeIn' 

保持畫廊之間的過渡期間相同的效果，試試這個選項：

nextMethod: 'changeIn' 

。

Answer 2

那麼我的建議是，除非你知道如何從自己的jQuery代碼之一，那麼你最好的選擇是保持環視淨，直到你能解決的東西。

如果您正在研究可能重新制作或擴展其中一個插件，那麼閱讀一本好書是JQuery：新手忍者，在亞馬遜上檢查它。那裏有很多好的提示和技巧。

http://www.amazon.co.uk/jQuery-Novice-Ninja-Earle-Castledine/dp/0980576857/ref=sr_1_1?ie=UTF8&qid=1322832342&sr=8-1

但是總的來說，你不想重新發明輪子。 因此，繼承人幾個鏈接，JQuery的燈箱插件

http://www.designyourway.net/blog/resources/30-efficient-jquery-lightbox-plugins/ http://webdesign14.com/30-best-jquery-lightbox-plugins/

Answer 3

添加自定義的轉換 -

(function ($, F) { 
    F.transitions.dropIn = function() { 
     var endPos = F._getPosition(true); 

     endPos.top = (parseInt(endPos.top, 10) - 200) + 'px'; 

     F.wrap.css(endPos).show().animate({ 
      top: '+=200px' 
     }, { 
      duration: F.current.openSpeed, 
      complete: F._afterZoomIn 
     }); 
    }; 

    F.transitions.dropOut = function() { 
     F.wrap.removeClass('fancybox-opened').animate({ 
      top: '-=200px' 
     }, { 
      duration: F.current.closeSpeed, 
      complete: F._afterZoomOut 
     }); 
    }; 

}(jQuery, jQuery.fancybox)); 

使用他們喜歡的 -

$(".fancybox").fancybox({ 
    openMethod : 'dropIn', 
    openSpeed : 250, 

    closeMethod : 'dropOut', 
    closeSpeed : 100 
}); 

而且哇拉 - 同樣的效果！

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.