initial commit
This commit is contained in:
192
assets/js/jquery-tiptip/jquery.tipTip.js
Normal file
192
assets/js/jquery-tiptip/jquery.tipTip.js
Normal file
@ -0,0 +1,192 @@
|
||||
/*
|
||||
* TipTip
|
||||
* Copyright 2010 Drew Wilson
|
||||
* www.drewwilson.com
|
||||
* code.drewwilson.com/entry/tiptip-jquery-plugin
|
||||
*
|
||||
* Version 1.3 - Updated: Mar. 23, 2010
|
||||
*
|
||||
* This Plug-In will create a custom tooltip to replace the default
|
||||
* browser tooltip. It is extremely lightweight and very smart in
|
||||
* that it detects the edges of the browser window and will make sure
|
||||
* the tooltip stays within the current window size. As a result the
|
||||
* tooltip will adjust itself to be displayed above, below, to the left
|
||||
* or to the right depending on what is necessary to stay within the
|
||||
* browser window. It is completely customizable as well via CSS.
|
||||
*
|
||||
* This TipTip jQuery plug-in is dual licensed under the MIT and GPL licenses:
|
||||
* http://www.opensource.org/licenses/mit-license.php
|
||||
* http://www.gnu.org/licenses/gpl.html
|
||||
*/
|
||||
|
||||
(function($){
|
||||
$.fn.tipTip = function(options) {
|
||||
var defaults = {
|
||||
activation: "hover",
|
||||
keepAlive: false,
|
||||
maxWidth: "200px",
|
||||
edgeOffset: 3,
|
||||
defaultPosition: "bottom",
|
||||
delay: 400,
|
||||
fadeIn: 200,
|
||||
fadeOut: 200,
|
||||
attribute: "title",
|
||||
content: false, // HTML or String to fill TipTIp with
|
||||
enter: function(){},
|
||||
exit: function(){}
|
||||
};
|
||||
var opts = $.extend(defaults, options);
|
||||
|
||||
// Setup tip tip elements and render them to the DOM
|
||||
if($("#tiptip_holder").length <= 0){
|
||||
var tiptip_holder = $('<div id="tiptip_holder" style="max-width:'+ opts.maxWidth +';"></div>');
|
||||
var tiptip_content = $('<div id="tiptip_content"></div>');
|
||||
var tiptip_arrow = $('<div id="tiptip_arrow"></div>');
|
||||
$("body").append(tiptip_holder.html(tiptip_content).prepend(tiptip_arrow.html('<div id="tiptip_arrow_inner"></div>')));
|
||||
} else {
|
||||
var tiptip_holder = $("#tiptip_holder");
|
||||
var tiptip_content = $("#tiptip_content");
|
||||
var tiptip_arrow = $("#tiptip_arrow");
|
||||
}
|
||||
|
||||
return this.each(function(){
|
||||
var org_elem = $(this);
|
||||
if(opts.content){
|
||||
var org_title = opts.content;
|
||||
} else {
|
||||
var org_title = org_elem.attr(opts.attribute);
|
||||
}
|
||||
if(org_title != ""){
|
||||
if(!opts.content){
|
||||
org_elem.removeAttr(opts.attribute); //remove original Attribute
|
||||
}
|
||||
var timeout = false;
|
||||
|
||||
if(opts.activation == "hover"){
|
||||
org_elem.on( 'mouseenter', function(){
|
||||
active_tiptip();
|
||||
} ).on( 'mouseleave', function(){
|
||||
if(!opts.keepAlive || !tiptip_holder.is(':hover')){
|
||||
deactive_tiptip();
|
||||
}
|
||||
});
|
||||
if(opts.keepAlive){
|
||||
tiptip_holder.on( 'mouseenter', function(){} ).on( 'mouseleave', function(){
|
||||
deactive_tiptip();
|
||||
});
|
||||
}
|
||||
} else if(opts.activation == "focus"){
|
||||
org_elem.on( 'focus', function(){
|
||||
active_tiptip();
|
||||
}).on( 'blur', function(){
|
||||
deactive_tiptip();
|
||||
});
|
||||
} else if(opts.activation == "click"){
|
||||
org_elem.on( 'click', function(){
|
||||
active_tiptip();
|
||||
return false;
|
||||
}).on( 'mouseenter', function(){} ).on( 'mouseleave' ,function(){
|
||||
if(!opts.keepAlive){
|
||||
deactive_tiptip();
|
||||
}
|
||||
});
|
||||
if(opts.keepAlive){
|
||||
tiptip_holder.on( 'mouseenter', function(){} ).on( 'mouseleave', function(){
|
||||
deactive_tiptip();
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
function active_tiptip(){
|
||||
opts.enter.call(this);
|
||||
tiptip_content.html(org_title);
|
||||
tiptip_holder.hide().css("margin","0");
|
||||
tiptip_holder.removeAttr('class');
|
||||
tiptip_arrow.removeAttr("style");
|
||||
|
||||
var top = parseInt(org_elem.offset()['top']);
|
||||
var left = parseInt(org_elem.offset()['left']);
|
||||
var org_width = parseInt(org_elem.outerWidth());
|
||||
var org_height = parseInt(org_elem.outerHeight());
|
||||
var tip_w = tiptip_holder.outerWidth();
|
||||
var tip_h = tiptip_holder.outerHeight();
|
||||
var w_compare = Math.round((org_width - tip_w) / 2);
|
||||
var h_compare = Math.round((org_height - tip_h) / 2);
|
||||
var marg_left = Math.round(left + w_compare);
|
||||
var marg_top = Math.round(top + org_height + opts.edgeOffset);
|
||||
var t_class = "";
|
||||
var arrow_top = "";
|
||||
var arrow_left = Math.round(tip_w - 12) / 2;
|
||||
|
||||
if(opts.defaultPosition == "bottom"){
|
||||
t_class = "_bottom";
|
||||
} else if(opts.defaultPosition == "top"){
|
||||
t_class = "_top";
|
||||
} else if(opts.defaultPosition == "left"){
|
||||
t_class = "_left";
|
||||
} else if(opts.defaultPosition == "right"){
|
||||
t_class = "_right";
|
||||
}
|
||||
|
||||
var right_compare = (w_compare + left) < parseInt($(window).scrollLeft());
|
||||
var left_compare = (tip_w + left) > parseInt($(window).width());
|
||||
|
||||
if((right_compare && w_compare < 0) || (t_class == "_right" && !left_compare) || (t_class == "_left" && left < (tip_w + opts.edgeOffset + 5))){
|
||||
t_class = "_right";
|
||||
arrow_top = Math.round(tip_h - 13) / 2;
|
||||
arrow_left = -12;
|
||||
marg_left = Math.round(left + org_width + opts.edgeOffset);
|
||||
marg_top = Math.round(top + h_compare);
|
||||
} else if((left_compare && w_compare < 0) || (t_class == "_left" && !right_compare)){
|
||||
t_class = "_left";
|
||||
arrow_top = Math.round(tip_h - 13) / 2;
|
||||
arrow_left = Math.round(tip_w);
|
||||
marg_left = Math.round(left - (tip_w + opts.edgeOffset + 5));
|
||||
marg_top = Math.round(top + h_compare);
|
||||
}
|
||||
|
||||
var top_compare = (top + org_height + opts.edgeOffset + tip_h + 8) > parseInt($(window).height() + $(window).scrollTop());
|
||||
var bottom_compare = ((top + org_height) - (opts.edgeOffset + tip_h + 8)) < 0;
|
||||
|
||||
if(top_compare || (t_class == "_bottom" && top_compare) || (t_class == "_top" && !bottom_compare)){
|
||||
if(t_class == "_top" || t_class == "_bottom"){
|
||||
t_class = "_top";
|
||||
} else {
|
||||
t_class = t_class+"_top";
|
||||
}
|
||||
arrow_top = tip_h;
|
||||
marg_top = Math.round(top - (tip_h + 5 + opts.edgeOffset));
|
||||
} else if(bottom_compare | (t_class == "_top" && bottom_compare) || (t_class == "_bottom" && !top_compare)){
|
||||
if(t_class == "_top" || t_class == "_bottom"){
|
||||
t_class = "_bottom";
|
||||
} else {
|
||||
t_class = t_class+"_bottom";
|
||||
}
|
||||
arrow_top = -12;
|
||||
marg_top = Math.round(top + org_height + opts.edgeOffset);
|
||||
}
|
||||
|
||||
if(t_class == "_right_top" || t_class == "_left_top"){
|
||||
marg_top = marg_top + 5;
|
||||
} else if(t_class == "_right_bottom" || t_class == "_left_bottom"){
|
||||
marg_top = marg_top - 5;
|
||||
}
|
||||
if(t_class == "_left_top" || t_class == "_left_bottom"){
|
||||
marg_left = marg_left + 5;
|
||||
}
|
||||
tiptip_arrow.css({"margin-left": arrow_left+"px", "margin-top": arrow_top+"px"});
|
||||
tiptip_holder.css({"margin-left": marg_left+"px", "margin-top": marg_top+"px"}).attr("class","tip"+t_class);
|
||||
|
||||
if (timeout){ clearTimeout(timeout); }
|
||||
timeout = setTimeout(function(){ tiptip_holder.stop(true,true).fadeIn(opts.fadeIn); }, opts.delay);
|
||||
}
|
||||
|
||||
function deactive_tiptip(){
|
||||
opts.exit.call(this);
|
||||
if (timeout){ clearTimeout(timeout); }
|
||||
tiptip_holder.fadeOut(opts.fadeOut);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
})(jQuery);
|
1
assets/js/jquery-tiptip/jquery.tipTip.min.js
vendored
Normal file
1
assets/js/jquery-tiptip/jquery.tipTip.min.js
vendored
Normal file
@ -0,0 +1 @@
|
||||
!function(O){O.fn.tipTip=function(t){var g,b,M,w=O.extend({activation:"hover",keepAlive:!1,maxWidth:"200px",edgeOffset:3,defaultPosition:"bottom",delay:400,fadeIn:200,fadeOut:200,attribute:"title",content:!1,enter:function(){},exit:function(){}},t);return O("#tiptip_holder").length<=0?(g=O('<div id="tiptip_holder" style="max-width:'+w.maxWidth+';"></div>'),b=O('<div id="tiptip_content"></div>'),M=O('<div id="tiptip_arrow"></div>'),O("body").append(g.html(b).prepend(M.html('<div id="tiptip_arrow_inner"></div>')))):(g=O("#tiptip_holder"),b=O("#tiptip_content"),M=O("#tiptip_arrow")),this.each(function(){var _,m,v=O(this);function t(){w.enter.call(this),b.html(_),g.hide().css("margin","0"),g.removeAttr("class"),M.removeAttr("style");var t=parseInt(v.offset().top),e=parseInt(v.offset().left),o=parseInt(v.outerWidth()),n=parseInt(v.outerHeight()),i=g.outerWidth(),r=g.outerHeight(),a=Math.round((o-i)/2),f=Math.round((n-r)/2),d=Math.round(e+a),u=Math.round(t+n+w.edgeOffset),p="",s="",l=Math.round(i-12)/2;"bottom"==w.defaultPosition?p="_bottom":"top"==w.defaultPosition?p="_top":"left"==w.defaultPosition?p="_left":"right"==w.defaultPosition&&(p="_right");var c=a+e<parseInt(O(window).scrollLeft()),h=i+e>parseInt(O(window).width());c&&a<0||"_right"==p&&!h||"_left"==p&&e<i+w.edgeOffset+5?(p="_right",s=Math.round(r-13)/2,l=-12,d=Math.round(e+o+w.edgeOffset),u=Math.round(t+f)):(h&&a<0||"_left"==p&&!c)&&(p="_left",s=Math.round(r-13)/2,l=Math.round(i),d=Math.round(e-(i+w.edgeOffset+5)),u=Math.round(t+f));i=t+n+w.edgeOffset+r+8>parseInt(O(window).height()+O(window).scrollTop()),f=t+n-(w.edgeOffset+r+8)<0;i||"_bottom"==p&&i||"_top"==p&&!f?("_top"==p||"_bottom"==p?p="_top":p+="_top",s=r,u=Math.round(t-(r+5+w.edgeOffset))):(f|("_top"==p&&f)||"_bottom"==p&&!i)&&("_top"==p||"_bottom"==p?p="_bottom":p+="_bottom",s=-12,u=Math.round(t+n+w.edgeOffset)),"_right_top"==p||"_left_top"==p?u+=5:"_right_bottom"!=p&&"_left_bottom"!=p||(u-=5),"_left_top"!=p&&"_left_bottom"!=p||(d+=5),M.css({"margin-left":l+"px","margin-top":s+"px"}),g.css({"margin-left":d+"px","margin-top":u+"px"}).attr("class","tip"+p),m&&clearTimeout(m),m=setTimeout(function(){g.stop(!0,!0).fadeIn(w.fadeIn)},w.delay)}function e(){w.exit.call(this),m&&clearTimeout(m),g.fadeOut(w.fadeOut)}""!=(_=w.content?w.content:v.attr(w.attribute))&&(w.content||v.removeAttr(w.attribute),m=!1,"hover"==w.activation?(v.on("mouseenter",function(){t()}).on("mouseleave",function(){w.keepAlive&&g.is(":hover")||e()}),w.keepAlive&&g.on("mouseenter",function(){}).on("mouseleave",function(){e()})):"focus"==w.activation?v.on("focus",function(){t()}).on("blur",function(){e()}):"click"==w.activation&&(v.on("click",function(){return t(),!1}).on("mouseenter",function(){}).on("mouseleave",function(){w.keepAlive||e()}),w.keepAlive&&g.on("mouseenter",function(){}).on("mouseleave",function(){e()})))})}}(jQuery);
|
Reference in New Issue
Block a user