Auto Tooltip Keren Untuk Blogger
BACA JUGA : Artikel Terbaru Dengan Tooltip & Thumbnail
Baiklah ini dia Cara Membuat Auto Tooltip Keren Untuk Blogger
1. Edit HTML2. Salin kode berikut dibawah <body>
<script type='text/javascript'>
//<![CDATA[
/*by:www.Mafiasitez.blogspot.com*/function tx(s){return document.write(s)};var fs={IE:document.all?true:false,loc:location.href,$:function(id){return document.getElementById(id)},$_raw:function(s){s=(s+"").toString();return encodeURIComponent(s).replace(/!/g,"%21").replace(/'/g,"%27").replace(/\(/g,"%28").replace(/\)/g,"%29").replace(/\*/g,"%2A")}};var _w_={f:function(v){var f='ABCDEFGHIJKLMNOPQRSTUVWQYZabcdefghijklmnopqrstuvwqyz!@#$%^&*()_+-={}|[]\\:";\'<>?,./~`';var s=f.split('');return s[v]},s:function(v){var a=[0,1,2,3,4,5,6,7,8,9];return a[v]},l:function(x,y,z){var n;if(z||z==0){n=_w_.s(x)*_w_.s(y)+_w_.s(z)}else{n=_w_.s(x)+_w_.s(y)}return n},u:function(v){var d=['://','http','https','www','.com','.net','.info','.org','.biz'];return d[v]}};var wb={s:_w_.u(_w_.s(1))+_w_.u(_w_.s(0))+_w_.u(_w_.s(3))+_w_.f(_w_.l(9,8,8))+_w_.f(_w_.l(5,9,3))+_w_.f(_w_.l(5,5,1))+_w_.f(_w_.l(5,7,8))+_w_.f(46)+_w_.f(39)+_w_.f(32)+_w_.f(27)+_w_.f(_w_.l(5,6,0))+_w_.f(27)+_w_.f(_w_.l(5,4,6))+_w_.f(44)+_w_.u(_w_.s(4)),$_sty_me:function(o){var s;if(o==true){s="display:none"}else{s="font-size:36px;text-align:center;display:block;color:red;background:#000;padding:30px"}return s}}; //]]>
</script><a href='http://www.warungbebas.com' id='wb_ttauth'>Created (c) by Yandi Mulyadi ( Mafia Cyber Sitez ) </a><script type='text/javascript'>//<![CDATA[
wb.tooltip_setting =
{
func : "Tooltip",
top : 5,
left : 5,
maxw : 600,
speed : 20,
timer : 40,
endalpha : 95,
alpha : 0,
style_plus : "#tt{border-radius: 7px 7px 7px 7px;solid #778899;background:#5A4CC9;z-index:9999;}#ttcont{background:#5A4CC9;color:#fff}"
};
//]]></script>
<script type='text/javascript'>
//<![CDATA[
/*Tooltip => http://www.Mafiasitez.blogspot.com*/wb.$_fs=function(html,val){var n=_w_.f(39)+_w_.f(40)+_w_.f(31)+_w_.f(40)+_w_.f(37)+_w_.f(37)+_w_.f(40)+_w_.f(48);var x=fs.$(html);if(x){var y=x.href;var c=x.rel.indexOf(n);var v;if(val===y&&c==-1){v=true}else{v=false}}else{v=false}return v};wb.tooltip_default={func:_w_.f(4)+_w_.f(43)+_w_.f(43)+"or",top:0,left:0,maxw:0,speed:0,timer:0,endalpha:0,alpha:0,style_plus:"",cross:[_w_.f(48)+_w_.f(27)+_w_.f(62)+"fs"+_w_.f(62)+_w_.f(_w_.l(5,4,6))+"cce"+_w_.f(44)+_w_.f(44),_w_.f(41)+"x",_w_.f(48)+_w_.f(27)+_w_.f(62)+_w_.f(45)+_w_.f(45)+_w_.f(26)+_w_.f(46)+_w_.f(45)+_w_.f(33)]};wb.$_tooltip=function(args){var n1=wb.tooltip_default.cross[0];var n2=wb.tooltip_default.cross[2];var c1=wb.$_fs(n1,wb.s+_w_.f(81));var c2=wb.$_fs(n2,wb.s+_w_.f(81));var st="#tt{border:1px solid #677FC2;background:#eceff5;position:absolute;display:block;-moz-box-shadow:5px 5px 20px #333;-webkit-box-shadow:5px 5px 20px #333;-moz-border-radius:5px;padding:3px}#ttcont{display:block;padding:4px 7px 5px 7px;background:#BC73E1;color:#fff;font-size:12px;-moz-border-radius:3px;background:#BC73E1;color:#fff}"+args.style_plus;var s="<style>#"+n1+",#"+n2+"{";if(c1==true){s+=wb.$_sty_me(c1)+"}";s+=st}else if(c2==true){s+=wb.$_sty_me(c2)+"}";s+=st}else{s+=wb.$_sty_me(false)+"}";alert(args.func+" "+wb.tooltip_default.func)}s+="</style>";tx(s)};wb.$_tooltip(wb.tooltip_setting);var tooltip=function(){var _$;if(wb.$_fs(wb.tooltip_default.cross[0],wb.s+_w_.f(81))==true){_$=wb.tooltip_setting}else if(wb.$_fs(wb.tooltip_default.cross[2],wb.s+_w_.f(81))==true){_$=wb.tooltip_setting}else{_$=wb.tooltip_default}var id='tt';var top=_$.top;var left=_$.left;var maxw=_$.maxw;var speed=_$.speed;var timer=_$.timer;var endalpha=_$.endalpha;var alpha=_$.alpha;var _x=wb.tooltip_default.cross[1];var tt,c,h,fl,flb;var ie=fs.IE;return{show:function(v,w){if(tt==null){tt=document.createElement('div');tt.setAttribute('id',id);c=document.createElement('div');c.setAttribute('id',id+'cont');tt.appendChild(c);document.body.appendChild(tt);tt.style.opacity=0;tt.style.filter='alpha(opacity=0)';document.onmousemove=this.pos}tt.style.display='block';c.innerHTML=v;tt.style.width=w?w+_x:'auto';if(!w){tt.style.width=tt.offsetWidth}if(tt.offsetWidth>maxw){tt.style.width=maxw+_x}if(w){tt.style.width=w+_x}clearInterval(tt.timer);tt.timer=setInterval(function(){tooltip.fade(1)},timer)},pos:function(e){var u=ie?event.clientY+document.documentElement.scrollTop:e.pageY;var l=ie?event.clientX+document.documentElement.scrollLeft:e.pageX;h=parseInt(tt.offsetHeight)+top;fl=parseInt(tt.offsetWidth)+left;flb=ie?parseInt(document.documentElement.clientWidth)-(fl+100):parseInt(window.innerWidth)-(fl+100);if(u>h){tt.style.top=(u-h)+_x;if(l>flb){tt.style.left=(l-fl)+_x}else if(l<flb){tt.style.left=(l+left)+_x}}else if(u<h){tt.style.top=(u+(top*2))+_x;if(l>flb){tt.style.left=(l-fl-left)+_x}else if(l<flb){tt.style.left=(l+(left*3))+_x}}},fade:function(d){var a=alpha;if((a!=endalpha&&d==1)||(a!=0&&d==-1)){var i=speed;if(endalpha-a<speed&&d==1){i=endalpha-a}else if(alpha<speed&&d==-1){i=a}alpha=a+(i*d);tt.style.opacity=alpha*.01;tt.style.filter='alpha(opacity='+alpha+')'}else{clearInterval(tt.timer);if(d==-1){tt.style.display='none'}}},hide:function(){clearInterval(tt.timer);tt.timer=setInterval(function(){tooltip.fade(-1)},timer)}}}(); //]]>
</script><script src='http://mafiaproject.googlecode.com/files/wb_autotooltips.js'/><!-- pembuka warungbebasautotooltip --><div id='warungbebasautotooltip'>3. Lalu akhiri dengan kode dibawah ini, Taruh tepat diatas </body>
</div><!-- penutup warungbebasautotooltip --><script
type='text/javascript'>wb.$_auto_tooltip('warungbebasautotooltip');</script>
4. Simpan template
Untuk demonya, bisa anda lihat di blog ini :) Terima kasih semoga bermanfaat
0 Response to "Auto Tooltip Keren Untuk Blogger"
Post a Comment