LinkinTips is Tooltip jQuery Plugin for Image

Satu tema postingan yang belum habis untuk dibahas yakni mengenai Tooltip Artikel easy jquery tooltip plugin sudah mewakili jenis tooltips yg ada. Koben menemukan juiz linkintips yaitu tooltip pada image, yg dapat menyertakan syntax link di area title? Karena merupakan trick script jQuery plugin, berarti harus punya<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

(function(a){var b;a.fn.juizLinkinTips=function(c){b=a.extend({},e,c);a(this).each(function(){var c=a(this).attr("title"),d='<span class="jTips">';d+=c.replace(RegExp(b.beforeURL+" (.*) "+b.beforeTitle+" (.*)","gi"),'<a href="$1" title="$2">$1</a>');d+="</span>";a(this).wrap('<span class="jTWrapper"></span>');a(this).parents("span:first").prepend(d);a(this).removeAttr("title")});a(".jTips").css("opacity","0");a("span.jTWrapper").mouseover(function(){a(this).children("span.jTips").stop(!0); a(this).children("span.jTips").css("display")=="none"&&a(this).children("span.jTips").css({display:"block"});a(this).children("span.jTips").animate({opacity:b.gotoOpacity,top:b.gotoTop,left:b.gotoLeft},b.duration)});a("span.jTWrapper").mouseout(function(){a(this).children("span.jTips").delay(b.tipsDelay);a(this).children("span.jTips").animate({opacity:0,top:"0px",left:"0px"},b.duration,function(){a(this).css({display:"none"})})})};var e={beforeURL:"go to the page",beforeTitle:"in order to", gotoOpacity:"0.9",gotoTop:"-17px",gotoLeft:"25px",duration:"300",tipsDelay:"300"}})(jQuery);

Script Pemanggil

$(document).ready(function() {
$("img[title]").juizLinkinTips();
});

.jTips {
 position: absolute;
 text-align: left;
 top: 0; left: 0;
 display: none;
 width: 150px;
 padding: 7px;
 font-size: 1em;
 line-height: 1.3em;
 color: #111;
 background: #fff;
 overflow: hidden;
 z-index: 500;
 border: 1px solid #555;
 -webkit-border-radius: 8px;
 border-radius: 8px;
 -webkit-box-shadow: 2px 2px 9px #000;
 box-shadow: 2px 2px 9px #000;
 word-wrap: break-word;
}
.jTWrapper {
 position: relative;
 display: inline-block;
 cursor: help;
}

Resource by: jq.creativejuiz.fr
Bonus links
purecss.io
brandcolors.net
luis-almeida.github.io/unveil
stylifyme.com
screensiz.es
Happy blogging \m/