0
안녕하세요 모두 내가 jQuery를 플러그인에 새로운 오전 따라서 약 가 을 파괴하고 내가 현재 사용하고이 플러그인에 (내가 그것을 다시 가져올 수있는)를 다시를 추가 이동하는 방법을 확실하지 오전 툴팁 용.JQuery와는 32 파괴 및 재설정 만드는
/**
* This is a simple jQuery plugin that make nice tooltips.
*
* @class ssTooltips
* @author Jacek Berbecki
*/
;(function($) {
'use strict';
$.ssTooltips = {version: '1.0.0'};
$.fn.ssTooltips = function(element, options) {
// set tooltip options
var settings = $.extend({
bgColor: '#333',
txtColor: '#f2f2f2',
maxWidth: 200,
borderRadius: 3,
fontSize: 12
}, options);
// get elements
var elements = $(element);
// start tooltip engine when elements exists
if(elements && elements.length > 0) {
// cteare tootlip element
var tooltipWrapper = $('<div id="tooltip-wrapper"></div>'),
tooltipBox = $('<div id="tooltip-box"></div>'),
tooltipArrow = $('<div id="tooltip-arrow"></div>');
// set tooltop element styles
tooltipWrapper.css({
'display': 'none',
'position': 'absolute',
'opacity': '0.95'
});
tooltipBox.css({
'background': settings.bgColor,
'padding': '5px 15px',
'color': settings.txtColor,
'border-radius': settings.borderRadius + 'px',
'box-shadow': '0 2px 6px -1px rgba(0,0,0,0.3)',
'max-width': settings.maxWidth + 'px',
'font-size': settings.fontSize + 'px'
});
tooltipArrow.css({
'width': '10px',
'height': '10px',
'background': settings.bgColor,
'position': 'absolute',
'left': '16px',
'bottom': '-4px',
'transform': 'rotate(45deg)'
});
// append tooltop to document
tooltipBox.appendTo(tooltipWrapper);
tooltipArrow.appendTo(tooltipWrapper);
$('body').append(tooltipWrapper);
// fire tooltip mouse actions
elements.each(function(index, element) {
var $this = $(this),
dataTxt = $this.attr('data-tooltip');
$this.removeAttr('title');
$this.on({
mousemove: function(event) {
tooltipWrapper
.css({
'left': event.pageX - 20,
'bottom': ($(window).height() - event.pageY + 20)
})
},
mouseenter: function(event) {
tooltipWrapper
.hide()
.fadeIn('fast');
tooltipBox
.empty()
.html(dataTxt);
},
mouseleave: function(event) {
tooltipWrapper
.stop()
.fadeOut('fast');
}
})
});
} else {
return false;
}
}
}(jQuery));
그리고 당신이 볼 수 있으므로, 등, 더 이 파괴되지 삭제 거기가 :
JS 코드
이있다.이의 모든 목적은 다시을 파괴 얻을 것, 내가 다시 버튼을 누를 경우 다음 그들에게를 보여 I 단추를 누르 때까지 페이지에 비활성화 툴팁에 나를위한 것입니다.
destroy: function() {
this._destroy(); //or this.delete; depends on jQuery version
this.element.unbind(this.eventNamespace)
this.bindings.unbind(this.eventNamespace);
//this.hoverable.removeClass("hover state");
//this.focusable.removeClass("focus state");
}
그러나 현재 코드에서 구현하는 방법을 확실하지 오전 :
은 내가 의 몇 가지 예는 기능 here을 발견 파괴를 참조하십시오. 데스트 리과 동일합니다.
그리고 도움이 될 것입니다!