Minal 'Aidin wal Faizin
Mampukah setiap tahun bertambah baik?
Sebuah tantangan bagi siapapun. Jadikan Idul fitri sebagai mement yang indah dan tepat untuk setiap kali merubah diri menjadi pribadi yang jauh lebih baik, lebih peduli, jauh dari korupsi, jauh dari iri hati dan dengki... dan tentu saja ... jauh lebih lebih berharga dimata Allah dan dan sesama.

Membuat Daftar isi Melayang

Pada postingan kali ini EFA akan memposting artikel tentang cara membuat daftar isi melayang. yang biasanya sesuatu yang melayang ini dipakai oleh para blogger mania untuk memasang iklan agar lebih optimal. disamping untuk mempercantik blog tentunya, juga untuk menghemat widget sidebar. untuk pembuatanyapun sangat mudah dan tidak repot. yang tentunya hal ini tidak saya desain sendiri tetapi script ini saya dapatkan dari sobat blogger saya. baiklah untuk lebih jelasnya ikuti langkah langkah berikut itupun bagi sobat blogger mania yang ingin mencobanya. dan untuk contohnya bisa sobat lihat pada blogger EFA.

Step Step/langkah langkah:

1. Masuk ke blogger
2. Tata Letak
3. Tambah widget Html atau Javascript
4. Copy paste script dibawah ini


<style type="text/css"> #di{ position:fixed; top:10px; z-index:+1000; }
* html #di{position:relative;}
.ditab{ height:200px; width:30px; float:left; cursor:pointer; background:url('http://imgur.com/Ly9Fh.jpg') no-repeat; }
.dicontent{ height:400px; float:left; border:2px solid #CCCCCC; background:#F5F5F5; padding:10px; }
</style>
<script type="text/javascript">
function showHideID(){
var di = document.getElementById("di");
var w = di.offsetWidth;
di.opened ? moveID(0, 30-w) : moveID(10-w, 0);
di.opened = !di.opened;
}
function moveID(x0, xf){
var di = document.getElementById("di");
var dx = Math.abs(x0-xf) > 10 ? 5 : 1;
var dir = xf>x0 ? 1 : -1;
var x = x0 + dx * dir;
di.style.right = x.toString() + "px";
if(x0!=xf){setTimeout("moveID("+x+", "+xf+")", 10);}
}
</script>
<div id="di">
<div class="ditab" onclick="showHideID()"> </div>
<div class="dicontent">
<div style="padding: 1px; overflow:auto; height: 400px;width: 300px;">
<div id="cl_option"> Loading... </div>
<div id="cl_content_list"> </div>
<script type="text/javascript">var jumlah_kata_dalam_ringkasan = 200;</script>
<script src="http://copycat91.googlecode.com/svn/trunk/contentlist.js"> </script>
<script src="http://fajar7siblings.blogspot.com/feeds/posts/default?alt=json-in-script&callback=onLoadFeed&max-results=500"> </script>
Modif By <a href='http://fajar7siblings.blogspot.com.blogspot.com/2010/04/membuat-daftar-isi-melayang.html'>Spirit 89 Blog</a>
</div> </div></div>
<script type="text/javascript">
var di = document.getElementById("di");
di.style.right = (30-di.offsetWidth).toString() + "px";
</script>

5. Ganti tulisan yang berwarna pink dengan alamat blog sobat blogger mania
6. yang terakhir dan paling utama save/simpan dan lihat hasilnya.

Selamat mencoba semoga bermanfaat. Sukses selalu buat anda...

 
Jangan Lupa Commentnya.......


     

 

The Owner of Education For All Blog hanyalah seorang Blogger pemula namun bila sobat blogger mania berminat untuk melihat tutorial lainya bergaya magazine blog silahkan. Akses melalui link di bawah ini :





» Selamat Berkreasi - E F A «


9comments:

  1. blog kamu bagus n rapi bikinin ya berapa biayanya?

    ReplyDelete
  2. Gila mantep banget nich blog.. ijin sedot ilmunya gan.. aku masih newbe... :D

    ReplyDelete
  3. biar lebih di mengerti oleh blogger newbie mohon di sertakan demo nya om

    ReplyDelete
  4. script itu diletakkan dimana..?

    ReplyDelete
  5. makasih bro :D infonya amat membantu :D
    ane udah pake itu daftar isi melayang :D

    ReplyDelete
  6. Terima kasih atas artikelnya.
    o iya selama saya jelajah mencari ilmu dengan blogwalking, menurut saya anda memiliki kelebihan tersendiri dari situs-situs lain dan jujur potensi anda juga sangat bagus, banyak juga ilmu yang saya pelajari disini jika ada waktu saya akan berkunjung lagi.

    ditunggu kunjungan baliknya :D

    u follow me, i follow u

    #Semoga sehat selalu :D

    ReplyDelete
  7. Master newbi mau nanya nie daftar isi ane koq kosong yaa...ada syarat lain supaya mau muncul gan...jika ada tlong bantu ane bner" kgax ngerti...

    Btw makasi atas kunjungnnya ke blog ane yang belum jadi alais masih standard hehehe...

    ReplyDelete

Terimakasih Atas Komentar Anda dan EFA akan segera menuju Blog anda...

NextPrev