jQuery 1.5 Released What's New

Perkembangan makin pesat nih. Berita singkat dari tim jQuery script. Mereka sudah meluncurkan versi teranyar, dan kini sudah bisa dipakai oleh kita-kita. Seperti biasa kita menggunakan dari yang embah google saja sob ;))
Tim jQuery telah merilis versi 1.5, sesuai jadwal! Rilis versi ini berisi beberapa peningkatan kinerja, perbaikan bug, utamanya menulis ulang dari modul Ajax dengan perbaikan diperpanjang, sebuah callback sistem manajemen tangguhan dan banyak lagi. Kurang paham juga mengenai detil dari si jQuery ini mah, swerrr gaptek bin gableg kalo urusan script =)) Bila ingin melihat sedikit penjelasan mengenai ini sobat bisa melihat di DevCurry!

Important Link

• Download jQuery 1.5 (regular) atau jQuery 1.5 (minified)
• New or Changed in jQuery 1.5: jQuery API
• Google CDN: https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js
• Microsoft CDN: http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.5.min.js

From google library

jQuery

Name: jquery

Latest version: 1.5.0

Load request: google.load("jquery", "1.5.0");

Extras: uncompressed:true (as in google.load("jquery", "1.5.0", {uncompressed:true});

Path: https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js

Path(u): https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.js

Site: http://jquery.com/

Note: 1.2.5 and 1.2.4 are not hosted due to their short and unstable lives in the wild...

Yaa udah ganti sana jQuery scriptnya dengan versi teranyar :)) see you ah \m/

Malaysia Blogger

Malaysia oh malaysia, ternyata banyak juga blogger full stylish dari sana. Masih ingat dengan Blog Walking to Malaysia, diakhir postingan ma Beben si bloglang anu ganteng kalem tea suruh acak-acak =))
Sobat ini juga masih dari negara Malaysieu :D Artikelnya jelas disampaikan, walau ada kata-kata bisa bikin senyum² sendiri kala mebacanya ;)) Nama dan alamat blognya yaitu...eit nanti dulu atuh ah, liat kesini juga nih 7 Blog Cantik Blogger Perempuan Malaysia =p~ Itulah mengapa Beben sedikit lama membagi postingan kali ini, jalan-jalan dulu atuh ke blog wece-wece malaysia :x :"> Silahkan kunjungi blog ini untuk menambah skill kita:)

THAT'S BLOG IS TERMINATED See you again with other blogger full stylish \m/

Prihatin Menyedihkan

Tidak tau ada fenomena apa di dunia perbloggeran khususnya, dan dunia perweban pada umumnya! Para developer diluaran sana kok sepertinya tidak gereget lagi dalam memosting. Mungkin issue HTML5 yang lagi marak, atribut canvas beserta featurenya, android yg lagi digandrungi dan banyak lagi seabrek objek futuristik memikat skill kita untuk menggalinya, otomatis menyita waktu b-) Banyak blogger sekarang kurang konsekuen dengan tema blog bawaannya. Memang sah-sah saja mau memosting apa saja kedalam blog. Apalagi dengan label/kategori mendukung kesana, menambah ragam, corak bagi para pelancong. Pertanyaannya adalah, jika semua blogger melakukan ini, dan tidak ada konsekuensi dengan tema awal blog itu dibuat dan mau bercerita mengenai apa blog kita tersebut? Maka mungkin hal terjadi macam kek gini ini. Banyak web berlomba-lomba memasukan guest post, membuat team, mengundang pelancong, mengadakan sayembara dan blabla.

Parahnya lagi tiap melancong ke salah satu blog/web artikel didapat sudah basi (maaf bukan menyindir) alias banyak bertebaran! Tanpa mengikutsertakan link sumber, seenakanya main kopas, sesuka hati buat blog tanpa melanjutkan dengan kontinyuitas kesinambungan (apa karena gratis, seenaknya dan terus menelantarkan) :-?
Beberapa faktor diatas yg Beben si bloglang anu ganteng kalem tea paparkan mungkin segelintir penyebab dari kacaunya dunia blogging. Mengapa kita mesti malu dengan blog kita yg sederhana, minder dg skill yg tak berkompeten, malas berkomentar... Semua akan kalah dengan jika kita memiliki stabilitas dalam berposting, konsekuen dengan tema, berterima kasih dengan artikel yg disampaikan ~!@#$%^&*()_+|
Teramat susah untuk membenahi ini semua jika tidak dimulai dari diri kita sendiri. Belajarlah menghormati web/blog yg memang sudah berdomain. Masa hanya kita merubah hal kecil saja mengakui itu buatan kita :)) Tampang loeeee tuh bau menyan!!! =))

Sebenarnya pengen mengeluarkan unek-unek ini semua ditulisan ini, tapi mungkin tidak ada efeknya juga kalau tidak bercermin kembali :D Pesan Beben cuman dikit saja kok

Dewasa dalam memandang dan menilai sesuatu, latih tanggung jawab, berdedikasi tinggi, jangan pernah licik...xixixi.

Sekian unek-unek celoteh tak ada arti, Wassalam :)

Replace Newer & Older Post Links with Post Titles

Kabar gembira nih sob, datang dari sobat kita berasal dari negara taiwan, namanya Fiona Lan :x Nama blognya ETBlue, kok kayak nama pelem si ET yak ;)) :D Makhluk alien yang lehernya panjang itu sob :-/ Sobat satu kita ini kayaknya gemar mengutak-ngatik daleman kode blogspot. Yah walau kendala ada dalam bahasa, enaknya ngebahas tutorial tuh asal ada gambar dan kode²nya bisa dipaksa mengerti =))
Pada setiap blog kita, pasti ada new post (pos terbaru) dan older post (pos lama) Berada pada dibawah tampilan pos paling akhir dari sebuah blog! Kalau tulisan older post/new post pada blogspot diganti dengan sebuah image itu sudah biasa sobat. Sekarang bagaimana tulisan si new post/older post itu dibikin jadi judul postingan dengan judul pos terkait berikutnya :-" b-)

Dengan bantuan script jQuery dan trik dari sobat kita ini, sekarang kita bisa mendapatkannya sob :) Jika pingin live demonya silahkan meluncur ke my dummies blog Blog Demo, kalau screenshot disini saja :P

Baguuuuuuuuuuuuus kan bisa jadi judul postingan b-) Sip, gaya, full stylish, keren and mentereng...bla bla bla!!! Yu lanjut ah bagaimana caranya bisa gito [..] Ingat trik ini jQuery plugin!!! Jadi pada template sobat sudah harus ada script<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script>

Kode CSS

Carilah kode ID CSS ini pada template sobat blog-pager-newer-link dan blog-pager-older-link biasanya bersebelahan sih :D Lalu tambahkan atribut kode CSS dengan inimax-width: 200px;
overflow: hidden;
height: 15pxJadi nanti akan seperti ini

#blog-pager-older-link {

<!-- kode CSS bawaan sobat -->

max-width: 200px;
overflow: hidden;
height: 15px
}

#blog-pager-newer-link {

<!-- kode CSS bawaan sobat -->

max-width: 200px;
overflow: hidden;
height: 15px
}

Tinggal menambahkan kode CSS yg berwarna merah tulisannya itu saja sob. Kode itu berfungsi untuk membatasi judul postingan panjang. Jadi dengan menggunakan tambahan kode CSS tersebut judul postingan yg panjang dibatasi agar tidak memanjang nantinya :) Atur saja sesuai selera sobat itu si panjangnnya (max-width) yak :D

jQuery Script

Masalah peletakan, coba didahulukan diletakan diatas tag </body>

<script type='text/javascript'>
//<![CDATA[
$(document).ready(function() {
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink + " .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link:first").text();
$("a.blog-pager-newer-link").text("<< " + newerLinkTitle);
});
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink + " .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$("a.blog-pager-older-link").text(olderLinkTitle + " >>");
});
});
//]]>
</script>

jQuery code by: www.bloggersentral.com

Save

Source details can be found here:

• http://etblue.blogspot.com/2011/01/blogger-change-newer-posts-link-and.html
• http://www.bloggersentral.com/2011/01/post-titles-replace-older-newer-post.html

See yah ah ah ah \m/

Twitter Bird Flying in The Blog

Tauk gambar lambang dari twitter! Burung berwarna biru yang imut-imut dan menjadi icon trade mark web tersebut? Bagaimana jika burung itu bisa berterbangan di blog kita, jika kita melakukan scroll pada monitor. Coba tengok disini floern.com, web keren dengan banyak tutorial (PHP) dan tools oke punya b-) Tapi hati-hati bahasanya sob :D Kelihatan kan ada burung warna biru sedang ngeliatin kita ;))
Hasil dari BW ke sobat kita http://vincicoppolas.blogspot.com/ Beben si bloglang anu ganteng kalem tea dapatkan script itu.

Trik ini lumayan menggunakan javascript sebesar 14.7 KB Jika sobat ingin memasang trik ini, caranya juga cukup mudah kok. Tinggal Add a Gadget ► HTML/Javascript :P Mari kita siapkan persiapan dan bumbunya sob :-" Silahkan didownload dulu gambar burungnya Bird Image! Setelah itu, ini kode javascriptnya

<script type='text/javascript'>
//<![CDATA[
if(typeof(twitterAccount)!="string"||twitterAccount=="")var twitterAccount="http://twitter.com/";if(typeof(tweetThisText)!="string"||tweetThisText=="")var tweetThisText=document.title+" "+document.URL;var tweetthislink=null;var birdSpeed=12;var birdSpaceVertical=16;var birdSetUp=2;var spriteWidth=64;var spriteHeight=64;var spriteAniSpeed=72;var spriteAniSpeedSlow=Math.round(spriteAniSpeed*1.75);var neededElems4random=10;var minElemWidth=Math.round(spriteWidth/3);var scareTheBirdMouseOverTimes=4;var scareTheBirdTime=1000;var birdIsFlying=false;var scrollPos=0;var windowHeight=450;if(typeof(window.innerHeight)=="number")windowHeight=window.innerHeight;else if(document.documentElement&&document.documentElement.clientHeight)windowHeight=document.documentElement.clientHeight;else if(document.body&&document.body.clientHeight)windowHeight=document.body.clientHeight;if(windowHeight<=spriteHeight+2*birdSpaceVertical)windowHeight=spriteHeight+2*birdSpaceVertical+1;var windowWidth=800;if(typeof(window.innerWidth)=="number")windowWidth=window.innerWidth;else if(document.documentElement&&document.documentElement.clientWidth)windowWidth=document.documentElement.clientWidth;else if(document.body&&document.body.clientWidth)windowWidth=document.body.clientWidth;if(windowWidth<=spriteWidth)windowWidth=spriteWidth+1;var birdPosX=Math.round(Math.random()*(windowWidth-spriteWidth+200)-200);var birdPosY=-2*spriteHeight;var timeoutAnimation=false;var timeoutFlight=false;var showButtonsTimeout=null;var hideButtonsTimeout=null;var scareTheBirdLastTime=0;var scareTheBirdCount=0;function tripleflapInit(reallystart){if(typeof(reallystart)=="undefined"){window.setTimeout("tripleflapInit(1)",250);return;}
if(!is_utf8(tweetThisText))tweetThisText=utf8_encode(tweetThisText);var tweetthislink="http://twitter.com/home?status="+escape(tweetThisText);var theBird=document.createElement("a");theBird.setAttribute("id","theBird");theBird.setAttribute("href",twitterAccount);theBird.setAttribute("target","_blank");theBird.style.display="block";theBird.style.position="absolute";theBird.style.left=birdPosX+"px";theBird.style.top=birdPosY+"px";theBird.style.width=spriteWidth+"px";theBird.style.height=spriteHeight+"px";theBird.style.background="url('"+birdSprite+"') no-repeat transparent";theBird.style.backgroundPosition="-0px -0px";theBird.style.zIndex="947";theBird.onmouseover=function(){scareTheBird();showButtonsTimeout=window.setTimeout("showButtons(0,"+windowWidth+")",400);window.clearTimeout(hideButtonsTimeout);};theBird.onmouseout=function(){hideButtonsTimeout=window.setTimeout("hideButtons()",50);};document.body.appendChild(theBird);var theBirdLtweet=document.createElement("a");theBirdLtweet.setAttribute("id","theBirdLtweet");theBirdLtweet.setAttribute("href",tweetthislink);theBirdLtweet.setAttribute("target","_blank");theBirdLtweet.setAttribute("title","twitteame");theBirdLtweet.style.display="none";theBirdLtweet.style.position="absolute";theBirdLtweet.style.left="0px";theBirdLtweet.style.top="-100px";theBirdLtweet.style.background="url('"+birdSprite+"') no-repeat transparent";theBirdLtweet.style.opacity="0";theBirdLtweet.style.filter="alpha(opacity=0)";theBirdLtweet.style.backgroundPosition="-64px -0px";theBirdLtweet.style.width="58px";theBirdLtweet.style.height="30px";theBirdLtweet.style.zIndex="951";theBirdLtweet.onmouseover=function(){window.clearTimeout(hideButtonsTimeout);};theBirdLtweet.onmouseout=function(){hideButtonsTimeout=window.setTimeout("hideButtons()",50);};document.body.appendChild(theBirdLtweet);var theBirdLfollow=theBirdLtweet.cloneNode(false);theBirdLfollow.setAttribute("id","theBirdLfollow");theBirdLfollow.setAttribute("href",twitterAccount);theBirdLfollow.setAttribute("title","Sigueme");theBirdLfollow.style.backgroundPosition="-64px -30px";theBirdLfollow.style.width="58px";theBirdLfollow.style.height="20px";theBirdLfollow.style.zIndex="952";theBirdLfollow.onmouseover=function(){window.clearTimeout(hideButtonsTimeout);};theBirdLfollow.onmouseout=function(){hideButtonsTimeout=window.setTimeout("hideButtons()",50);};document.body.appendChild(theBirdLfollow);var timeoutAnimation=window.setTimeout("animateSprite(0,0,0,0,null,true)",spriteAniSpeed);window.onscroll=recheckposition;recheckposition();}
function animateSprite(row,posStart,posEnd,count,speed,onlySet){if(typeof(count)!="number"||count>posEnd-posStart)count=0;document.getElementById("theBird").style.backgroundPosition="-"+Math.round((posStart+count)*spriteWidth)+"px -"+(spriteHeight*row)+"px";if(onlySet==true)return;if(typeof(speed)!="number")speed=spriteAniSpeed;timeoutAnimation=window.setTimeout("animateSprite("+row+","+posStart+","+posEnd+","+(count+1)+","+speed+")",speed);}
function animateSpriteAbort(){window.clearTimeout(timeoutAnimation);}
function recheckposition(force){if(force!=true)force=false;if(birdIsFlying)
return false;if(typeof(window.innerHeight)=="number")windowHeight=window.innerHeight;else if(document.documentElement&&document.documentElement.clientHeight)windowHeight=document.documentElement.clientHeight;else if(document.body&&document.body.clientHeight)windowHeight=document.body.clientHeight;if(windowHeight<=spriteHeight+2*birdSpaceVertical)windowHeight=spriteHeight+2*birdSpaceVertical+1;if(typeof(window.innerWidth)=="number")windowWidth=window.innerWidth;else if(document.documentElement&&document.documentElement.clientWidth)windowWidth=document.documentElement.clientWidth;else if(document.body&&document.body.clientWidth)windowWidth=document.body.clientWidth;if(windowWidth<=spriteWidth)windowWidth=spriteWidth+1;if(typeof(window.pageYOffset)=="number")scrollPos=window.pageYOffset;else if(document.body&&document.body.scrollTop)scrollPos=document.body.scrollTop;else if(document.documentElement&&document.documentElement.scrollTop)scrollPos=document.documentElement.scrollTop;birdPosY=parseInt(document.getElementById("theBird").style.top);birdPosX=parseInt(document.getElementById("theBird").style.left);if(scrollPos+birdSpaceVertical>=birdPosY||scrollPos+windowHeight-spriteHeight<birdPosY||force){hideButtons();elemPosis=chooseNewTarget();if(elemPosis.length<1){elemType=null;elemNr=null;elemTop=scrollPos+Math.round(Math.random()*(windowHeight-spriteHeight));elemLeft=Math.round(Math.random()*(windowWidth-spriteWidth));elemWidth=0;}
else{newTarget=elemPosis[Math.round(Math.random()*(elemPosis.length-1))];elemType=newTarget[0];elemNr=newTarget[1];elemTop=newTarget[2];elemLeft=newTarget[3];elemWidth=newTarget[4];}
targetTop=elemTop-spriteHeight;targetLeft=Math.round(elemLeft-spriteWidth/2+Math.random()*elemWidth);if(targetLeft>windowWidth-spriteWidth-24)
targetLeft=windowWidth-spriteWidth-24;else if(targetLeft<0)
targetLeft=0;birdIsFlying=true;flyFromTo(birdPosX,birdPosY,targetLeft,targetTop,0);}}
function chooseNewTarget(){var elemPosis=new Array();var obergrenze=scrollPos+spriteHeight+birdSpaceVertical;var untergrenze=scrollPos+windowHeight-birdSpaceVertical;for(var ce=0;ce<targetElems.length;ce++){var elemType=targetElems[ce];var sumElem=document.getElementsByTagName(elemType).length;for(var cu=0;cu<sumElem;cu++){var top=document.getElementsByTagName(elemType)[cu].offsetTop;var left=document.getElementsByTagName(elemType)[cu].offsetLeft;var width=document.getElementsByTagName(elemType)[cu].offsetWidth;if(top<=obergrenze||top>=untergrenze||width<minElemWidth||left<0){continue;}
elemPosis[elemPosis.length]=new Array(elemType,cu,top,left,width);if(elemPosis.length>=neededElems4random)
return elemPosis;}}
return elemPosis;}
function flyFromTo(startX,startY,targetX,targetY,solved,direction){justStarted=(solved==0);solved+=(solved>birdSpeed/2)?birdSpeed:Math.round((solved==0)?birdSpeed/4:birdSpeed/2);solvedFuture=solved+((solved>birdSpeed/2)?birdSpeed:Math.round(birdSpeed/2));distanceX=targetX-startX;distanceY=targetY-startY;distance=Math.sqrt(distanceX*distanceX+distanceY*distanceY);solvPerc=Math.abs(1/distance*solved);solvDistX=Math.round(distanceX*solvPerc);solvDistY=Math.round(distanceY*solvPerc);solvPercFuture=Math.abs(1/distance*solvedFuture);solvDistXFuture=Math.round(distanceX*solvPercFuture);solvDistYFuture=Math.round(distanceY*solvPercFuture);if(typeof(direction)!="string"){direction=null;angle=((distanceX!=0)?Math.atan((-distanceY)/distanceX)/Math.PI*180:90)+((distanceX<0)?180:0);if(angle<0)angle+=360;if(angle<45)direction='o';else if(angle<135)direction='n';else if(angle<202.5)direction='w';else if(angle<247.5)direction='sw';else if(angle<292.5)direction='s';else if(angle<337.5)direction='so';else direction='o';}
if(Math.abs(solvDistXFuture)>=Math.abs(distanceX)&&Math.abs(solvDistYFuture)>=Math.abs(distanceY)){animateSpriteAbort();switch(direction){case'so':animateSprite(1,0,0,0,null,true);break;case'sw':animateSprite(1,2,2,0,null,true);break;case's':animateSprite(0,2,2,0,null,true);break;case'n':animateSprite(4,0,0,0,null,true);break;case'o':animateSprite(1,0,0,0,null,true);break;case'w':animateSprite(1,2,2,0,null,true);break;default:animateSprite(0,0,0,0,null,true);}
timeoutAnimation=window.setTimeout("animateSprite(0,0,0,0,null,true)",spriteAniSpeed);}
if(Math.abs(solvDistX)>=Math.abs(distanceX)&&Math.abs(solvDistY)>=Math.abs(distanceY)){solvDistX=distanceX;solvDistY=distanceY;birdIsFlying=false;window.setTimeout("recheckposition()",500);}
else{if(justStarted){animateSpriteAbort();switch(direction){case'so':animateSprite(1,0,0,0,null,true);timeoutAnimation=window.setTimeout("animateSprite(1,1,1,0,null,true)",spriteAniSpeed);break;case'sw':animateSprite(1,2,2,0,null,true);timeoutAnimation=window.setTimeout("animateSprite(1,3,3,0,null,true)",spriteAniSpeed);break;case's':animateSprite(0,2,2,0,null,true);timeoutAnimation=window.setTimeout("animateSprite(0,3,3,0,null,true)",spriteAniSpeed);break;case'n':timeoutAnimation=window.setTimeout("animateSprite(4,0,3,0,"+spriteAniSpeedSlow+")",1);break;case'o':animateSprite(1,0,0,0,null,true);timeoutAnimation=window.setTimeout("animateSprite(2,0,3,0,"+spriteAniSpeedSlow+")",spriteAniSpeed);break;case'w':animateSprite(1,2,2,0,null,true);timeoutAnimation=window.setTimeout("animateSprite(3,0,3,0,"+spriteAniSpeedSlow+")",spriteAniSpeed);break;default:animateSprite(0,0,0,0,null,true);}}
timeoutFlight=window.setTimeout("flyFromTo("+startX+","+startY+","+targetX+","+targetY+","+solved+",'"+direction+"')",50);}
hideButtons();document.getElementById("theBird").style.left=(startX+solvDistX)+"px";document.getElementById("theBird").style.top=(startY+solvDistY+birdSetUp)+"px";}
function scareTheBird(nul){newTS=new Date().getTime();if(scareTheBirdLastTime<newTS-scareTheBirdTime){scareTheBirdCount=1;scareTheBirdLastTime=newTS;}
else{scareTheBirdCount++;if(scareTheBirdCount>=scareTheBirdMouseOverTimes){scareTheBirdCount=0;scareTheBirdLastTime=0;recheckposition(true);}}}
function showButtons(step,minWidth){birdPosY=parseInt(document.getElementById("theBird").style.top);birdPosX=parseInt(document.getElementById("theBird").style.left);if(step==0&&document.getElementById("theBirdLtweet").style.display=="block")step=100;if(birdIsFlying)step=0;opacity=Math.round(step*15);if(opacity<0)opacity=0;if(opacity>100)opacity=100;if(birdPosX<minWidth-300||birdPosX<minWidth/2){buttonPosX1=birdPosX+spriteWidth-15;buttonPosX2=birdPosX+spriteWidth-10;}
else{buttonPosX1=birdPosX+16-parseInt(document.getElementById("theBirdLtweet").style.width);buttonPosX2=birdPosX+11-parseInt(document.getElementById("theBirdLfollow").style.width);}
buttonPosY1=birdPosY-4;buttonPosY2=birdPosY-4+parseInt(document.getElementById("theBirdLtweet").style.height);document.getElementById("theBirdLtweet").style.left=buttonPosX1+"px";document.getElementById("theBirdLtweet").style.top=buttonPosY1+"px";document.getElementById("theBirdLtweet").style.display="block";document.getElementById("theBirdLtweet").style.opacity=opacity/100;document.getElementById("theBirdLtweet").style.filter="alpha(opacity="+opacity+")";document.getElementById("theBirdLfollow").style.left=buttonPosX2+"px";document.getElementById("theBirdLfollow").style.top=buttonPosY2+"px";document.getElementById("theBirdLfollow").style.display="block";document.getElementById("theBirdLfollow").style.opacity=opacity/100;document.getElementById("theBirdLfollow").style.filter="alpha(opacity="+opacity+")";if(opacity>=100)return;step++;showButtonsTimeout=window.setTimeout("showButtons("+step+","+minWidth+")",60);}
function hideButtons(){window.clearTimeout(showButtonsTimeout);document.getElementById("theBirdLtweet").style.display="none";document.getElementById("theBirdLtweet").style.opacity="0";document.getElementById("theBirdLtweet").style.filter="alpha(opacity=0)";document.getElementById("theBirdLfollow").style.display="none";document.getElementById("theBirdLfollow").style.opacity="0";document.getElementById("theBirdLfollow").style.filter="alpha(opacity=0)";}
function utf8_encode(str){str=str.replace(/\r\n/g,"\n");utf8str="";for(n=0;n<str.length;n++){c=str.charCodeAt(n);if(c<128){utf8str+=String.fromCharCode(c);}
else if(c>127&&c<2048){utf8str+=String.fromCharCode((c>>6)|192);utf8str+=String.fromCharCode((c&63)|128);}
else{utf8str+=String.fromCharCode((c>>12)|224);utf8str+=String.fromCharCode(((c>>6)&63)|128);utf8str+=String.fromCharCode((c&63)|128);}}
return utf8str;}
function is_utf8(str){strlen=str.length;for(i=0;i<strlen;i++){ord=str.charCodeAt(i);if(ord<0x80)continue;else if((ord&0xE0)===0xC0&&ord>0xC1)n=1;else if((ord&0xF0)===0xE0)n=2;else if((ord&0xF8)===0xF0&&ord<0xF5)n=3;else return false;for(c=0;c<n;c++)
if(++i===strlen||(str.charCodeAt(i)&0xC0)!==0x80)
return false;}
return true;}//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var birdSprite='.../birdsprite.png';
var targetElems=new Array('img','hr','table','td','div','input','textarea','button','select','ul','ol','li','h1','h2','h3','h4','p','code','object','a','b','strong','span');
var twitterAccount = 'http://www.facebook.com/pages/Prodigy-of-Head/122292581115426';
var twitterThisText ='';
tripleflapInit();//]]>
</script>

Hehehe...pendek yak :D
NB:

1. Script warna merah.
Gantikan dengan gambar hasil dari download.
2. Script warna biru.
Isikan dengan link tujuan.

The Making of Widget / Gadget

Iseng lagi sob gak ada kerjaan. Sudah mumet mau kemana lagi mencari ide postingan yang gaya punya untuk dibagi. Sebagai si bloglang anu ganteng kalem tea Beben menclok ke halaman ini How to create a simple Gadget for Blogger with the new API! Kalau ada sobat yg mahir dalam script bisa mencoba membuat widget sendiri (bagus lagi untuk semua blogger) b-) Disana @amandafazani selaku owner dari web blogger buster menerangkan secara sederhana bagaimana cara membuat satu buah widget buat blogspot ;)) Secara default didalam blogspot sendiri telah tersedia beberapa gadget dengan kategori Basics, Featured, Most Popular, More Gadgets, Add your own.

Khusus untuk gadget dengan category Add your own, disini ini gaya dan uniknya sob :D Secara mamih google sudah menyediakan pembuatan widget ini. Bagi yg memang paham mengenai script dapat melihat dokumentasi google mengenai hal ini Gadgets for Blogger, dan silahkan buat gadget yg berguna bagi semua blogger Indonesia [khususnya] dan dunia pada umumnya ;)) Contoh ada, tempat testing ada, sarana sudah ada dan tinggal kitanya saja nih memperdalam script :-"

Gadget?

Gadget API terdiri dari beberapa blok bangunan sederhana: XML, HTML, dan JavaScript. Untuk memulai, yang kita butuhkan adalah pemahaman dasar tentang HTML. Kami akan mengajarkan semua yang perlu diketahui tentang XML untuk menulis gadget. Kemudian, ketika kita menulis gadget yang lebih canggih, kita mungkin akan belajar beberapa JavaScript.

XML adalah bahasa markup tujuan umum. Ini menggambarkan data terstruktur dengan cara yang baik manusia dan komputer dapat membaca dan menulis.

XML adalah bahasa yang akan digunakan untuk menulis spesifikasi gadget. Gadget adalah hanya file XML, ditempatkan di suatu tempat di internet di mana Google dapat menemukannya. File XML yang menetapkan gadget berisi petunjuk tentang cara untuk memproses dan membuat gadget. File XML dapat berisi semua data dan kode untuk gadget, atau dapat memiliki referensi (URL) untuk mana untuk menemukan sisa elemen.

HTML adalah bahasa markup yang digunakan untuk halaman format di internet. Isi statis gadget biasanya ditulis dalam HTML. HTML terlihat mirip dengan XML, tapi itu digunakan untuk memformat dokumen web daripada untuk mendeskripsikan data terstruktur.

JavaScript adalah bahasa scripting dapat kita gunakan untuk menambahkan perilaku dinamis untuk sebuah gadget.

Mari kita lanjutkan berkreasi menggunakan add your own gadget ini!!! Walau kita sebagai newbie, tenang saja teman-teman, Beben juga kagak bisa kalau buat widget mah ;;) Disini Beben si bloglang anu ganteng kalem tea akan berbagi caranya bagaimana mendapatkan sebuah widget dan ternyata tidak ada didalam kategori gadget bawaan blogspot b-) BigFootNote Langkah-langkah awal persiapan:

1. Bukalah halaman berikut.
Open this link Add gadgets to your homepage! Nanti sobat akan melihat jejeran gadget yg sudah jadi disana!!! Lihat pada sebelah kiri, ada kategori yg bisa dipilih, silahkan klik untuk mempersingkat mencari gadget yg diinginkan.
2. Pilihlah gadget kalian.
Sebagai contoh, Beben ambil gadget TV Watch.
3. Trik mengambil link untuk dijadikan gadget.
Setelah mengklik link pada langkah ke-2, maka akan tampak sbb:

Lalu carilah link yg bertuliskan SOURCE!, kemudian klik dan lihat di address bar browsingan?

Ambilah semua link tersebut yg ada pada address bar, lalu lari ke halaman Design ► Page Elements ► Add a Gadget ► pilihlah Add your own ► masukan link yg tadi di address bar!


4. Final example result.
Silahkan tunggu loadingannya beres yak ;:))
• Expand here for look screenshot.
  
• Expand here for look some real gadget!
  
  
  
  
  

Beberapa link gadget pilihan Beben, mungkin sobat mau coba...

1. http://www.webcams.travel/services/gadget/randomwebcam.xml
Menampilkan gambar web cam diseluruh jalan kota hawaii :D Gambar tersebut akan reload terus setiap refresh.
2. http://hosting.gmodules.com/ig/gadgets/file/116495266976257712756/facebook.xml ERROR
Menampilkan facebook secara mini. Mantap :-bd
3. http://www.blogger.com/gadgets/post.xml ERROR
Gadget post, untuk membuat postingan menjadi mudah.

Jika gadget sudah jadi, sobat dapat meng-add lewat mari Blogger Gadget Submissions. Kalau mau lebih melatih bisa loncat ke API Developer's Guide Gadgets API.
Happy widget ria sobat-sobat :-h \m/

jQuery Greybox on Blogspot

Masih teringat tidak dengan artikel ini Popup Gaya With jQuery dan Beben si bloglang anu ganteng kalem tea juga pernah minta tolong disini help!!! Sampai detik ini masalahnya belom ketemo sob :-s malah ini blog nambah aneh lagi masalahnya...beugh !@#$%^&*()_ Beberapa trik seperti popup, hover jQuery sekarang gak berjalan dengan perfect. Setiap ke halaman postingan dan pada keadaan home memang berbeda, tapi yak itu tadi sob bedanya ini blog edan pada keadaan home normal trik berjalan. Pada keadaan full posting trik mendet alias berantakan :)) Sudahlah sob, itu masalah si bloglang, biarin saja maunya gimana ini blog edan :))

Masih seputar trik berbau-bau popup, kali ini serupa tapi lain caranya sob.

D E M O

Image yg akan ditampilkan telah dibatasi dengan metode frame, sehingga tidak akan melebihi lebar dan tinggi yg sudah ditetapkan. Sobat nanti hanya tinggal membubuhkan atribut class='greybox' pada setiap penulisan syntax. Contoh:<a class="greybox" href="http://your-link" title="your title">YOUR TITLE</a>Mudahkan sob :)

Kode CSS

#GB_overlay {
background: #000;
opacity: 0.7;
position: fixed;
top: 0;
left: 0;
z-index: 100;
width: 100%;
height: 100%;
cursor: pointer;
margin: auto;
}
* html #GB_overlay { background: #000 url(http://www.blogger.com/img/blank.gif) }
#GB_window {
top: 40px;
left: 0;
position: fixed;
background: #EEE3B5;
border: 5px solid #777;
overflow: auto;
width: 100%;
height: 400px;
z-index: 150;
}
#GB_frame {
border: 0;
overflow: auto;
width: 100%;
height: 400px;
}
#GB_caption {
font: 12px bold helvetica, verdana, sans-serif;
color: #fff;
background: #666;
text-align: left;
border-bottom: 5px solid #777;
margin: 0;
padding: 2px 0 3px 5px;
}
#GB_window img {
position: absolute;
top: 2px;
right: 3px;
cursor: pointer;
}

jQuery Script

<script type='text/javascript'>
//<![CDATA[
/* Greybox Redux
* Required: http://jquery.com/
* Written by: John Resig
* Based on code by: 4mir Salihefendic (http://amix.dk)
* License: LGPL (read more in LGPL.txt)
*/
var GB_DONE = false;
var GB_HEIGHT = 400;
var GB_WIDTH = 400;

function GB_show(caption, url, height, width) {
GB_HEIGHT = height || 400;
GB_WIDTH = width || 400;
if (!GB_DONE) {
$(document.body).append("<div id='GB_overlay'></div><div id='GB_window'><div id='GB_caption'></div>" + "<img src='http://www.blogger.com/img/close.png' alt='Close'/></div>");
$("#GB_window img").click(GB_hide);
$("#GB_overlay").click(GB_hide);
$(window).resize(GB_position);
GB_DONE = true;
}
$("#GB_frame").remove();
$("#GB_window").append("<iframe id='GB_frame' src='" + url + "'></iframe>");
$("#GB_caption").html(caption);
$("#GB_overlay").show();
GB_position();
if (GB_ANIMATION) $("#GB_window").slideDown("slow");
else $("#GB_window").show();
}

function GB_hide() {
$("#GB_window,#GB_overlay").hide();
}

function GB_position() {
var de = document.documentElement;
var w = self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
$("#GB_window").css({
width: GB_WIDTH + "px",
height: GB_HEIGHT + "px",
left: ((w - GB_WIDTH) / 2) + "px"
});
$("#GB_frame").css("height", GB_HEIGHT - 32 + "px");
} //]]>
</script>

Untuk script ini letakan dibawah kode jQuery inti<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js' type='text/javascript'></script>Bisa juga dicoba letakan setelah kode ]]></b:skin>Lalu scroll kebagian bawah template, temukan tag penutup </body> dan masukin script jQuery pemanggil dibawah ini

<script type='text/javascript'>
    //<![CDATA[
    var GB_ANIMATION = true;
    $(document).ready(function() {
        $("a.greybox").click(function() {
            var t = this.title || this.innerHTML || this.href;
            GB_show(t, this.href, 615, 900);
            return false;
        });
    }); //]]>
</script>

Godluck and happy blogging \m/