MediaWiki:Gadget-tipsy-deprecated.js
外观
注意:保存之后,你必须清除浏览器缓存才能看到做出的更改。Google Chrome、Firefox、Microsoft Edge及Safari:按住⇧ Shift键并单击工具栏的“刷新”按钮。参阅Help:绕过浏览器缓存以获取更多帮助。
$(function () {
function maybeCall(thing, ctx) {
return typeof thing == "function" ? thing.call(ctx) : thing;
}
function Tipsy(element, options) {
this.$element = $(element);
this.options = options;
this.enabled = true;
this.keyHandler = $.proxy(this.closeOnEsc, this);
this.fixTitle();
}
Tipsy.prototype = {
show: function () {
var title = this.getTitle();
if (title && this.enabled) {
var $tip = this.tip();
$tip.find(".tipsy-inner")[this.options.html ? "html" : "text"](title);
$tip[0].className = "tipsy";
if (this.options.className) {
$tip.addClass(maybeCall(this.options.className, this.$element[0]));
}
$tip.remove().css({ top: 0, left: 0, visibility: "hidden", display: "block" }).attr("aria-hidden", "true").appendTo(document.body);
var pos = $.extend({}, this.$element.offset(), { width: this.$element[0].offsetWidth, height: this.$element[0].offsetHeight });
var gravity = typeof this.options.gravity == "function" ? this.options.gravity.call(this.$element[0]) : this.options.gravity;
$tip.addClass("tipsy-" + gravity);
if (this.options.className) {
$tip.addClass(maybeCall(this.options.className, this.$element[0]));
}
var actualWidth = $tip[0].offsetWidth,
actualHeight = $tip[0].offsetHeight;
var tp;
switch (gravity.charAt(0)) {
case "n":
tp = { top: pos.top + pos.height + this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2 };
break;
case "s":
tp = { top: pos.top - actualHeight - this.options.offset, left: pos.left + pos.width / 2 - actualWidth / 2 };
break;
case "e":
tp = { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left - actualWidth - this.options.offset };
break;
case "w":
tp = { top: pos.top + pos.height / 2 - actualHeight / 2, left: pos.left + pos.width + this.options.offset };
break;
}
if (gravity.length == 2) {
if (gravity.charAt(1) == "w") {
if (this.options.center) {
tp.left = pos.left + pos.width / 2 - 15;
} else {
tp.left = pos.left;
}
} else {
if (this.options.center) {
tp.left = pos.left + pos.width / 2 - actualWidth + 15;
} else {
tp.left = pos.left + pos.width;
}
}
}
$tip.css(tp);
$(document).on("keydown", this.keyHandler);
if (this.options.fade) {
$tip.stop().css({ opacity: 0, display: "block", visibility: "visible" }).attr("aria-hidden", "false").animate({ opacity: this.options.opacity }, 100);
} else {
$tip.css({ visibility: "visible", opacity: this.options.opacity }).attr("aria-hidden", "false");
}
}
},
hide: function () {
$(document).off("keydown", this.keyHandler);
if (this.options.fade) {
this.tip()
.stop()
.fadeOut(100, function () {
$(this).remove();
});
} else {
this.tip().remove();
}
},
fixTitle: function () {
var $e = this.$element;
if ($e.attr("title") || typeof $e.attr("original-title") != "string") {
$e.attr("original-title", $e.attr("title") || "").removeAttr("title");
}
},
getTitle: function () {
var title,
$e = this.$element,
o = this.options;
this.fixTitle();
if (typeof o.title == "string") {
title = $e.attr(o.title == "title" ? "original-title" : o.title);
} else if (typeof o.title == "function") {
title = o.title.call($e[0]);
}
title = ("" + title).replace(/(^\s*|\s*$)/, "");
return title || o.fallback;
},
tip: function () {
if (!this.$tip) {
this.$tip = $('<div class="tipsy" role="tooltip"></div>').html('<div class="tipsy-arrow"></div><div class="tipsy-inner"></div>');
}
return this.$tip;
},
validate: function () {
if (!this.$element[0].parentNode) {
this.hide();
this.$element = null;
this.options = null;
}
},
closeOnEsc: function (e) {
if (e.keyCode === 27) {
this.hide();
}
},
enable: function () {
this.enabled = true;
},
disable: function () {
this.enabled = false;
},
toggleEnabled: function () {
this.enabled = !this.enabled;
},
};
$.fn.tipsy = function (options) {
if (options === true) {
return this.data("tipsy");
} else if (typeof options == "string") {
var tipsy = this.data("tipsy");
if (tipsy) tipsy[options]();
return this;
}
options = $.extend({}, $.fn.tipsy.defaults, options);
function get(ele) {
var tipsy = $.data(ele, "tipsy");
if (!tipsy) {
tipsy = new Tipsy(ele, $.fn.tipsy.elementOptions(ele, options));
$.data(ele, "tipsy", tipsy);
}
return tipsy;
}
function enter() {
var tipsy = get(this);
tipsy.hoverState = "in";
if (options.delayIn == 0) {
tipsy.show();
} else {
tipsy.fixTitle();
setTimeout(function () {
if (tipsy.hoverState == "in") tipsy.show();
}, options.delayIn);
}
}
function leave() {
var tipsy = get(this);
tipsy.hoverState = "out";
if (options.delayOut == 0) {
tipsy.hide();
} else {
setTimeout(function () {
if (tipsy.hoverState == "out") tipsy.hide();
}, options.delayOut);
}
}
this.each(function () {
get(this);
});
if (options.trigger != "manual") {
var eventIn = options.trigger == "hover" ? "mouseenter focus" : "focus",
eventOut = options.trigger == "hover" ? "mouseleave blur" : "blur";
if (options.live) {
mw.track("mw.deprecate", "tipsy-live");
mw.log.warn('Use of the "live" option of jquery.tipsy is no longer supported.');
}
this.on(eventIn, enter).on(eventOut, leave);
}
return this;
};
$.fn.tipsy.defaults = { className: null, delayIn: 0, delayOut: 0, fade: true, fallback: "", gravity: "n", center: true, html: false, live: false, offset: 0, opacity: 1.0, title: "title", trigger: "hover" };
$.fn.tipsy.elementOptions = function (ele, options) {
return $.metadata ? $.extend({}, options, $(ele).metadata()) : options;
};
$.fn.tipsy.autoNS = function () {
return $(this).offset().top > $(document).scrollTop() + $(window).height() / 2 ? "s" : "n";
};
$.fn.tipsy.autoWE = function () {
return $(this).offset().left > $(document).scrollLeft() + $(window).width() / 2 ? "e" : "w";
};
$.fn.tipsy.autoBounds = function (margin, prefer) {
return function () {
var dir = { ns: prefer[0], ew: prefer.length > 1 ? prefer[1] : false },
boundTop = $(document).scrollTop() + margin,
boundLeft = $(document).scrollLeft() + margin,
$this = $(this);
if ($this.offset().top < boundTop) dir.ns = "n";
if ($this.offset().left < boundLeft) dir.ew = "w";
if ($(window).width() + $(document).scrollLeft() - $this.offset().left < margin) dir.ew = "e";
if ($(window).height() + $(document).scrollTop() - $this.offset().top < margin) dir.ns = "s";
return dir.ns + (dir.ew ? dir.ew : "");
};
};
});
mw.util.addCSS(".tipsy{padding:5px;position:absolute;z-index:100000;cursor:default}.tipsy-inner{background-color:var(--background-color-base,#fff);color:var(--color-base,#202122);max-width:15em;padding:5px 8px 4px 8px;border:1px solid var(--border-color-base,#a2a9b1);border-radius:2px}.tipsy-arrow{position:absolute;background:url(/w/resources/src/jquery.tipsy/images/tipsy.png?93eac) no-repeat top left;width:11px;height:6px} .tipsy-n .tipsy-arrow{top:0;left:50%;margin-left:-5px} .tipsy-nw .tipsy-arrow{top:0;left:10px} .tipsy-ne .tipsy-arrow{top:0;right:10px} .tipsy-s .tipsy-arrow{bottom:0;left:50%;margin-left:-5px;background-position:bottom left} .tipsy-sw .tipsy-arrow{bottom:0;left:10px;background-position:bottom left} .tipsy-se .tipsy-arrow{bottom:0;right:10px;background-position:bottom left} .tipsy-e .tipsy-arrow{top:50%;margin-top:-5px;right:0;width:6px;height:11px;background-position:top right} .tipsy-w .tipsy-arrow{top:50%;margin-top:-5px;left:0;width:6px;height:11px}");