代码之家  ›  专栏  ›  技术社区  ›  Ropstah

jQuery Colorbox背景转换效果?

  •  3
  • Ropstah  · 技术社区  · 16 年前

    我发现jQuery Colorbox的背景转换非常“困难”。找不到可以指定自定义转换的设置。 是否可以为背景创建淡入淡出效果,如 Nyro Modal

    1 回复  |  直到 16 年前
        1
  •  11
  •   Luca Filosofi    8 年前

    更新2

    演示: http://so.lucafilosofi.com/jquery-colorbox-background-transition-effect/

    $('.example').colorbox({
        //added to remove initial flickering
        opacity : 0,
        //use the onOpen event...
        onOpen: function() {
            // prevent Overlay from being displayed...
            $('#cboxOverlay,#colorbox').css('visibility', 'hidden');
            // make the overlay visible and
            // re-add all it's original properties!
            $('#cboxOverlay').css({
                'visibility': 'visible',
                'opacity': 0.9,
                'cursor': 'pointer'
                // execute our original animation on the overlay!
                // animate it you can use here all the
                // possible animate combination or plugin...
            }).animate({
                height: ['toggle', 'swing'],
                opacity: 'toggle'
            }, 1000 , function() {
                $('#colorbox').css({
                'visibility': 'visible'
            }).fadeIn(1000);
            });
        }
    });