2010-05-03 5 views
3

jQuery Colorbox의 배경 전환이 매우 어렵다는 것을 알았습니다. 사용자 지정 전환을 지정할 수있는 설정을 찾을 수 없습니다. Nyro Modal과 같은 배경에 페이드 효과를 만들 수 있습니까?jQuery Colorbox 배경 전환 효과?

+0

행동에서 볼! ;-) –

답변

11

는 완화 효과와2 업데이트

DEMO :http://so.devilmaycode.it/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); 
     }); 
    } 
}); 
+0

당신의 예제는 괜찮아 보이지만, 상자의 디스플레이는 배경이 끝나기를 기다리는 'wait'가 아니다 ... 나는 그걸위한 유효한 해결책이 없다고 생각한다. ..? – Ropstah

+0

예 가능! 업데이트를 참조하십시오! –

+0

당신은 형제입니다! ;-) 물론 fadeIn 및 viceversa 대신 animate를 사용할 수 있다는 것을 잊지 마십시오! 또한 가볍게 치기 쉬운 플러그인을 사용하십시오! –