colorbox 닫기 애니메이션 삭제하기

Question

colorbox 닫기 애니메이션을 어떻게 제거합니까?

엄지 손가락이 많이 표시됩니다. 클릭하면 전체 내용이 담긴 색상 상자가 표시되고 해당 내용에 대한 색상 상자 슬라이드 쇼에 대한 링크가 포함됩니다. 슬라이드 쇼 색상 상자가 닫히면 원본 전체 내용이 다시 열리지 만 닫기 애니메이션을 사용하면 내용을 다시 열기 전에 슬라이드 쇼가 닫힌 것입니다. 초기화 옵션에서 전환을 없음으로 설정하면 여는 전환은 제거되지만 닫는 애니메이션은 제거되지 않습니다.

감사합니다.

 var trip = getTripById(this.id); 
     currentTrip = trip; 
     var tripModal = createTripModal(trip); 
     openTripModal(tripModal); 

여행 모달 내용 : : 나는 다른 변수에 원래 $.colorbox.close 기능을 절약하고 다른 기능에 $.colorbox.close 기능을 설정 결국

var currentTrip; 

function openTripModal(tripModal) 
{ 
    var trans = "elastic"; 
    if(arguments[1] == "none") 
    { 
     console.log(arguments); 
     trans = "none"; 
    } 
    $.colorbox(
     { 
      html: tripModal, 
      transition: trans, 
      onComplete: function(){ 
       console.log("complete loaded"); 
       $(".photos").colorbox( 
         { 
          html: "If you close me, I will hopefully open the current trip again", 
          onClosed: function(){ 
           console.log('closing photoslides1'); 
           var modal = createTripModal(currentTrip); 
           openTripModal(modal, "none"); 
          }, 
          transition:"none" 
         } 
       ); 
      } 
     } 
    ); 
} 

Answer 1

---

콘텐츠 초기화하려면 내가 보여 주었던 이전 정보를 열 수 있습니다. 이전 정보가 열리면 (전체 기능을 열었을 때) 원래 $colorbox.close() 기능을 복원합니다.

var currentTrip; 

var originalClose; 


function getOrig(){ 
    return $.colorbox.close; 
} 

originalClose = getOrig(); 

function openTripModal(tripModal) 
{ 
    $.colorbox.close = originalClose; 
    $.colorbox(
     { 
      html: tripModal, 
      onComplete: function(){ 
       $(".photos").colorbox( 
        { 
         html: createTripSlideshow(currentTrip.id), 
         onComplete: function(){ 
          thumbs$ = $('.trip-thumbnails') 
           .anythingSlider({ 
            mode: "horizontal", 
            buildArrows   : false,  // If true, builds the forwards and backwards buttons 
            buildNavigation  : false,  // If true, builds a list of anchor links to link to each panel 
            buildStartStop  : false,  // If true, builds the start/stop button    autoPlay: true, 
            width: 138, 
            height: 80, 
            hashTags: false, 
            showMultiple: 6, 
            changeBy: 1, 
            animationTime: 0 
           }); 
           thumbs = thumbs$.data('AnythingSlider'); 


          slider$ = $('.trip-slideshow') 
           .anythingSlider({ 
            mode: "horizontal", 
            buildArrows   : false,  // If true, builds the forwards and backwards buttons 
            buildNavigation  : false,  // If true, builds a list of anchor links to link to each panel 
            buildStartStop  : false,  // If true, builds the start/stop button    autoPlay: true, 
            width: 570, 
            hashTags: false, 
            height: 380, 
            onSlideComplete : function() 
            { 
             slideTemp = slider$.data('AnythingSlider'); 
             $('.slideshow-title .slide-number').text( slideTemp.currentPage + "/" + slideTemp.pages ); 
             $('.thumbclick').removeClass('active'); 
             $(".trip-thumbnails").find("li:eq("+slideTemp.currentPage+")").find("img").addClass('active'); 
            } 
           }); 
           slider = slider$.data('AnythingSlider'); 
           $(".slideshow-wrap .next-arrow").click(function(){ 
            slider.goForward(); 
            if(!slider.playing) 
            { 
             $('.slides-play').removeClass('pause'); 
             slider.startStop(slider.playing); 
            } 
           }); 
           $(".slideshow-wrap .prev-arrow").click(function(){ 
            slider.goBack(); 
            if(!slider.playing) 
            { 
             $('.slides-play').removeClass('pause'); 
             slider.startStop(slider.playing); 
            } 
           }); 
           $(".slideshow-wrap .slides-play").click(function(){ 
            var play = slider.playing; 
            if(!play) 
             $('.slides-play').addClass("pause"); 
            else 
             $('.slides-play').removeClass("pause"); 
            slider.startStop(!play); 
           }); 


           $(".thumbnail.next-arrow").click(function(){ 
            thumbs.goForward(); 
           }); 

           $(".thumbnail.prev-arrow").click(function(){ 
            thumbs.goBack(); 
           }); 

           $.colorbox.close = function(){ 
            slider.startStop(false); 
            $('trip-slideshow').remove(); 
            $('trip-thumbnails').remove(); 

            var modal = createTripModal(currentTrip); 
            openTripModal (modal);  
           } 

           $(".thumbclick").click(function() 
           { 
            var len = this.src.length; 
            var index = this.src.substring(len - 6, len - 4 ); 
            index = parseInt(index, 10); 
            $('.trip-thumbnails').anythingSlider(index); 
            $('.trip-slideshow').anythingSlider(index); 
            $('.slides-play').removeClass('pause'); 

           }); 

         } 
        } 
       );// end photos modal 


       var formHtml = createFormHtml(currentTrip); 
       $(".request-info").colorbox( 
        { 
         html: formHtml, 
         onComplete: function() 
         { 
          $.colorbox.close = function(){ 
           var modal = createTripModal(currentTrip); 
           openTripModal (modal);  
          } 
          $('.trip-information-request .cancel').click(function() 
           { 
           $.colorbox.close();        
           } 
          ); 

          $('.trip-information-request form').validate(
           { 
            rules: { 
             f_firstname: "required", 
             f_lastname: "required", 
             f_email: "required email", 
             f_phone: "required" 
            }, 
            messages: { 
             f_firstname: "Please provide your first name", 
             f_lastname: "Please provide your last name", 
             f_email:{ 
              required: "Please enter your email", 
              email: "Please enter a valid email" 
             }, 
             f_phone: "Please provide your phone number" 
            }, 
            submitHandler: function() 
            { 
             //submit code 
             alert("validation successully passed"); 


             var thankYou ="     <div class='trip-information-request'>\ 
                  <p class='trip-thank-you-header'>Thank you!</p>\ 
                  <p class='trip-thank-you'>\ 
                   We've received your email and will respond within 2 business days.\ 
                  </p>\ 
                  <p class='trip-thank-you'>\ 
                   If you have any additional questions, please contact us at 1.xxx.xxx.xxxx.\ 
                  </p>\ 
                  <div class='trip-thank-you return'>\ 
                   return to trips\ 
                  </div>\ 
                 </div>"; 

             $.colorbox({html:thankYou, onComplete: function(){ $('.trip-thank-you.return').click(function(){ $.colorbox.close();}); }});          


            } 
           } 
          ); 
          $('.trip-information-request .submit').click(function(){$('.trip-information-request form').submit(); $.colorbox.resize(); }); 
         } 
        } 
       ); 


      }//end oncomplete function 
     } 
    ); 
}