Twitter Bootstrap popover hide animation을 사용자 정의하는 방법

Question

내 자신의 Popover Hide Animation을 구현하고 싶습니다. 현재 bootstrap.js를 직접 수정하고 있습니다. 나는 팝 오버를

$('#target').popover({ 
    hide: function() { 
     //my own animation 
    } 
}); 

Answer 1

좋은 질문 - 뇌 - 맛보기를 초기화하기 때 동적 애니메이션을 달성 할 수 있도록

$.fn.popover = function (option) { 
      return this.each(function() { 
       var $this = $(this) 
        , data = $this.data('popover') 
        , options = typeof option == 'object' && option 
       if (!data) $this.data('popover', (data = new Popover(this, options))) 

       //original code 
       // if (typeof option == 'string') data[option]() 
       //custom code 
       if (typeof option == 'string') { 
        if (option === 'hide') { 
         //my customize animation here 
        } 
        else { 
         data[option](); 
        } 

       } 

      }) 
     } 

어쨌든이 있는지 알고 싶습니다! 당신은 확실히 그것을 할 수 있습니다. 원본 소스 코드를 엉망으로 만들지 않고 플러그인을 확장하는 방법을 살펴보십시오.

$.fn.popover = function (orig) { 
    return function(options) { 
    return this.each(function() { 
     orig.call($(this), options); 
     if (typeof options.hide == 'function') { 
     $(this).data('bs.popover').hide = function() { 
      options.hide.call(this.$tip, this); 
      orig.Constructor.prototype.hide.call(this); 
     }; 
     } 
    }); 
    } 
}($.fn.popover); 

여기 있습니다! 우리는 우리 자신의 기본 popover 기능을 확장했습니다. 이제 사용 해보세요 :

위의 팝 오버에는 맞춤 애니메이션 효과가 있습니다.

물론 hide 옵션을 제공하지 않으면 기본 동작을 갖게됩니다.

데모

: 당신이 팝업을 보여 주면서 애니메이션 할 수있는 코드를 제공 할 수http://jsfiddle.net/VHDwa/71/