1 /* 2 * TipTip 3 * Copyright 2010 Drew Wilson 4 * www.drewwilson.com 5 * code.drewwilson.com/entry/tiptip-jquery-plugin 6 * 7 * Version 1.3 - Updated: Mar. 23, 2010 8 * 9 * This Plug-In will create a custom tooltip to replace the default 10 * browser tooltip. It is extremely lightweight and very smart in 11 * that it detects the edges of the browser window and will make sure 12 * the tooltip stays within the current window size. As a result the 13 * tooltip will adjust itself to be displayed above, below, to the left 14 * or to the right depending on what is necessary to stay within the 15 * browser window. It is completely customizable as well via CSS. 16 * 17 * This TipTip jQuery plug-in is dual licensed under the MIT and GPL licenses: 18 * http://www.opensource.org/licenses/mit-license.php 19 * http://www.gnu.org/licenses/gpl.html 20 */ 21 22(function($){ 23 $.fn.tipTip = function(options) { 24 var defaults = { 25 activation: "hover", 26 keepAlive: false, 27 maxWidth: "200px", 28 edgeOffset: 3, 29 defaultPosition: "bottom", 30 delay: 400, 31 fadeIn: 200, 32 fadeOut: 200, 33 attribute: "title", 34 content: false, // HTML or String to fill TipTIp with 35 enter: function(){}, 36 exit: function(){} 37 }; 38 var opts = $.extend(defaults, options); 39 40 // Setup tip tip elements and render them to the DOM 41 if($("#tiptip_holder").length <= 0){ 42 var tiptip_holder = $('<div id="tiptip_holder" style="max-width:'+ opts.maxWidth +';"></div>'); 43 var tiptip_content = $('<div id="tiptip_content"></div>'); 44 var tiptip_arrow = $('<div id="tiptip_arrow"></div>'); 45 $("body").append(tiptip_holder.html(tiptip_content).prepend(tiptip_arrow.html('<div id="tiptip_arrow_inner"></div>'))); 46 } else { 47 var tiptip_holder = $("#tiptip_holder"); 48 var tiptip_content = $("#tiptip_content"); 49 var tiptip_arrow = $("#tiptip_arrow"); 50 } 51 52 return this.each(function(){ 53 var org_elem = $(this); 54 if(opts.content){ 55 var org_title = opts.content; 56 } else { 57 var org_title = org_elem.attr(opts.attribute); 58 } 59 if(org_title != ""){ 60 if(!opts.content){ 61 org_elem.removeAttr(opts.attribute); //remove original Attribute 62 } 63 var timeout = false; 64 65 if(opts.activation == "hover"){ 66 org_elem.hover(function(){ 67 active_tiptip(); 68 }, function(){ 69 if(!opts.keepAlive){ 70 deactive_tiptip(); 71 } 72 }); 73 if(opts.keepAlive){ 74 tiptip_holder.hover(function(){}, function(){ 75 deactive_tiptip(); 76 }); 77 } 78 } else if(opts.activation == "focus"){ 79 org_elem.focus(function(){ 80 active_tiptip(); 81 }).blur(function(){ 82 deactive_tiptip(); 83 }); 84 } else if(opts.activation == "click"){ 85 org_elem.click(function(){ 86 active_tiptip(); 87 return false; 88 }).hover(function(){},function(){ 89 if(!opts.keepAlive){ 90 deactive_tiptip(); 91 } 92 }); 93 if(opts.keepAlive){ 94 tiptip_holder.hover(function(){}, function(){ 95 deactive_tiptip(); 96 }); 97 } 98 } 99 100 function active_tiptip(){ 101 opts.enter.call(this); 102 tiptip_content.html(org_title.replace(/\|/gi,"<br /><img src='/img/marca_evento.gif' alt=' ' style='vertical-align:middle' />")); /*Adicionando marcador para os eventos*/ 103 tiptip_holder.hide().removeAttr("class").css("margin","0"); 104 tiptip_arrow.removeAttr("style"); 105 106 var top = parseInt(org_elem.offset()['top']); 107 var left = parseInt(org_elem.offset()['left']); 108 var org_width = parseInt(org_elem.outerWidth()); 109 var org_height = parseInt(org_elem.outerHeight()); 110 var tip_w = tiptip_holder.outerWidth(); 111 var tip_h = tiptip_holder.outerHeight(); 112 var w_compare = Math.round((org_width - tip_w) / 2); 113 var h_compare = Math.round((org_height - tip_h) / 2); 114 var marg_left = Math.round(left + w_compare); 115 var marg_top = Math.round(top + org_height + opts.edgeOffset); 116 var t_class = ""; 117 var arrow_top = ""; 118 var arrow_left = Math.round(tip_w - 12) / 2; 119 120 if(opts.defaultPosition == "bottom"){ 121 t_class = "_bottom"; 122 } else if(opts.defaultPosition == "top"){ 123 t_class = "_top"; 124 } else if(opts.defaultPosition == "left"){ 125 t_class = "_left"; 126 } else if(opts.defaultPosition == "right"){ 127 t_class = "_right"; 128 } 129 130 var right_compare = (w_compare + left) < parseInt($(window).scrollLeft()); 131 var left_compare = (tip_w + left) > parseInt($(window).width()); 132 133 if((right_compare && w_compare < 0) || (t_class == "_right" && !left_compare) || (t_class == "_left" && left < (tip_w + opts.edgeOffset + 5))){ 134 t_class = "_right"; 135 arrow_top = Math.round(tip_h - 13) / 2; 136 arrow_left = -12; 137 marg_left = Math.round(left + org_width + opts.edgeOffset); 138 marg_top = Math.round(top + h_compare); 139 } else if((left_compare && w_compare < 0) || (t_class == "_left" && !right_compare)){ 140 t_class = "_left"; 141 arrow_top = Math.round(tip_h - 13) / 2; 142 arrow_left = Math.round(tip_w); 143 marg_left = Math.round(left - (tip_w + opts.edgeOffset + 5)); 144 marg_top = Math.round(top + h_compare); 145 } 146 147 var top_compare = (top + org_height + opts.edgeOffset + tip_h + 8) > parseInt($(window).height() + $(window).scrollTop()); 148 var bottom_compare = ((top + org_height) - (opts.edgeOffset + tip_h + 8)) < 0; 149 150 if(top_compare || (t_class == "_bottom" && top_compare) || (t_class == "_top" && !bottom_compare)){ 151 if(t_class == "_top" || t_class == "_bottom"){ 152 t_class = "_top"; 153 } else { 154 t_class = t_class+"_top"; 155 } 156 arrow_top = tip_h;
157 marg_top = Math.round(top - (tip_h + 5 + opts.edgeOffset)); 158 } else if(bottom_compare | (t_class == "_top" && bottom_compare) || (t_class == "_bottom" && !top_compare)){ 159 if(t_class == "_top" || t_class == "_bottom"){ 160 t_class = "_bottom"; 161 } else { 162 t_class = t_class+"_bottom"; 163 } 164 arrow_top = -12; 165 marg_top = Math.round(top + org_height + opts.edgeOffset); 166 } 167 168 if(t_class == "_right_top" || t_class == "_left_top"){ 169 marg_top = marg_top + 5; 170 } else if(t_class == "_right_bottom" || t_class == "_left_bottom"){ 171 marg_top = marg_top - 5; 172 } 173 if(t_class == "_left_top" || t_class == "_left_bottom"){ 174 marg_left = marg_left + 5; 175 } 176 tiptip_arrow.css({"margin-left": arrow_left+"px", "margin-top": arrow_top+"px"}); 177 tiptip_holder.css({"margin-left": marg_left+"px", "margin-top": marg_top+"px"}).attr("class","tip"+t_class); 178 179 if (timeout){ clearTimeout(timeout); } 180 timeout = setTimeout(function(){ tiptip_holder.stop(true,true).fadeIn(opts.fadeIn); }, opts.delay); 181 } 182 183 function deactive_tiptip(){ 184 opts.exit.call(this); 185 if (timeout){ clearTimeout(timeout); } 186 tiptip_holder.fadeOut(opts.fadeOut); 187 } 188 } 189 }); 190 } 191})(jQuery);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.