Daftar Isi Slide in Top Bar

Saat membuka http://www.blogger.com/, coba pilih bahasa Indonesia, pada sisi kiri dibawah tulisan BLOG DI UPDATE PADA ..., tampak tulisan yang berubah-ubah setiap saat. Jika anda menaruh cursor di atasnya text tersebut akan link ke alamat blog saat di klik.

Sebenarnya trik tersebut bisa juga jadi solusi bagi pengguna blog yang ingin artikel lamanya tetap exist dan tampil pada layout halaman meskipun tak lagi jadi headline.

Jika ada yang tertarik menggunakannya, berikut adalah scriptnya :

<script type="text/javascript">

var delay = 4000;
var maxsteps=30;
var stepdelay=40;
var startcolor= new Array(255,255,255);
var endcolor=new Array(0,0,0);

var fcontent=new Array();

begintag='<div style="font: bold 11px verdana; padding: 2px;z-index:125">';

function srk(json) {
for (var i = 0; i <= json.feed.openSearch$totalResults.$t - 1; i++)
{
var entry = json.feed.entry[i];
var posturl;
if (i == json.feed.entry.length) break;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
posturl = entry.link[k].href;
break;
}
}
fcontent[i]=json.feed.entry[i].title.$t.link(posturl);
}
}
closetag='</div>';

</script>
<script src="http://abgamal.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=srk"></script>

<script>
var fwidth='450px';
var fheight='10px';

var fadelinks=1;


var ie4=document.all&&!document.getElementById;
var DOM2=document.getElementById;
var faderdelay=0;
var index=0;


function changecontent(){
if (index>=fcontent.length)
index=0
if (DOM2){
document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
document.getElementById("fscroller").innerHTML=begintag+fcontent[index]+closetag
if (fadelinks)
linkcolorchange(1);
colorfade(1, 15);
}
else if (ie4)
document.all.fscroller.innerHTML=begintag+fcontent[index]+closetag;
index++
}


function linkcolorchange(step){
var obj=document.getElementById("fscroller").getElementsByTagName("A");
if (obj.length>=1){
for (i=0;i<=obj.length-1;i++)
obj[i].style.color=getstepcolor(step);
}
}


var fadecounter;
function colorfade(step) {
if(step<=maxsteps) {
document.getElementById("fscroller").style.color=getstepcolor(step);
if (fadelinks)
linkcolorchange(step);
step++;
fadecounter=setTimeout("colorfade("+step+")",stepdelay);
}else{
clearTimeout(fadecounter);
document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
setTimeout("changecontent()", delay);

}
}


function getstepcolor(step) {
var diff
var newcolor=new Array(3);
for(var i=0;i<=2;i++) {
diff = (startcolor[i]-endcolor[i]);
if(diff > 0) {
newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
} else {
newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
}
}
return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
}

if (ie4DOM2)
document.write('<div id="fscroller" style="border:0px solid black;z-index:125;width:'+fwidth+';height:'+fheight+'"></div>');

if (window.addEventListener)
window.addEventListener("load", changecontent, false)
else if (window.attachEvent)
window.attachEvent("onload", changecontent)
else if (document.getElementById)
window.onload=changecontent

</script>


Bagian yang berwarna merah ganti dengan alamat blog anda,
kemudian buka TATA LETAK > TAMBAH GADGET > HTML/JAVASCRIPT >
Copy Paste script diatas

Kemudan di Save
Semoga sukses

Related Posts by Categories

slide in

daftar isi

• Daftar Isi Scroll Bar
• Daftar Isi Auto Scroll
• Daftar Isi Slide in Page
• Daftar Isi Blogger Debug/error javascript