Buat Tabview Paling Mudah

Setelah browsing mencari tutorial membuat tabview akhirnya aku menemukan tutorial yang lumayan bagus n praktis, awalnya setelah browsing dari berbagai tutorial tabview yang menurut aku terlalu ribet akhirnya aku putuskan memakai cara-cara seperti dibawah ini.Caranya gak susah kok tinggal copy code script dibawah kemudian salin di Page Elements-HTML/Javascript tidak perlu meng-edit code script template kita. Coba aja kalau g percaya...!

<style type="text/css">div.TabTampil div.TTs{height: 24px; overflow: hidden; }div.TabTampil div.TTs a:hover, div.TabTampil div.TTs a.Active{ background-color: #77d0ee; }div.TabTampil div.Halamans{ clear: both; border: 1px solid #0199cb; overflow: hidden; background-color: #ffffff;}div.TabTampil div.Halamans div.Halaman{ height: 100%; padding: 0px; overflow: hidden; }div.TabTampil div.Halamans div.Halaman div.Alas{ padding: 3px 5px; }div.TabTampil div.TTs a{ border-left:1px solid #0199cb; border-right:1px solid #0199cb; border-top:1px solid #0199cb; border-bottom:0px solid #0199cb; float: left;display: block; width: 104px; text-align: center; height: 24px; padding-top: 3px; vertical-align: middle; text-decoration: none; font-family: "Arial", Serif;font-size: 12px; font-weight: 900; color: #222}</style>
<form action="tabtampil.html" method="get">
<div id="TabTampil" class="TabTampil"><div style="width: 318px;" class="TTs"> <a>My Labels</a> <a>Tab 2 Name</a> <a>Tab 3 Name</a></div>
<div style="width: 316px; height: 200px;" class="Halamans">

<div class="Halaman">
<div class="Alas">
<ul><li><a href="http://workshop-robot.blogspot.com/">Workshop Robot</a></li>
<li><a href="http://workshop-robot.blogspot.com/2009/01/membuat-gambar-selalu-terlihat.html">Membuat Gambar Selalu Tampil Diatas Layar</a></li>
</ul></div></div>

<div class="Halaman">
<div class="Alas">
Maaf lom ada isinya...!
</div></div>

<div class="Halaman">
<div class="Alas">
Maaf lom ada isinya...!
</div></div>

</form><script style="text/javascript" src="http://meichelina.googlepages.com/newscriptab.js"></script><script type="text/javascript">tabtampil_inisial('TabTampil');</script>

Kode dibawah ini :

<a href="http://workshop-robot.blogspot.com/2009/01/membuat-gambar-selalu-terlihat.html">Membuat Gambar Selalu Tampil Diatas Layar

Silahkan ganti dengan :

<a href="http://Nama blog kamu.blogspot.com/search/label/Nama label kamu/">Nama label yang akan muncul

Met mencoba...!

Comments :

2 komentar to “Buat Tabview Paling Mudah”
agung mengatakan...
on 

izin save info Bozz

Donny mengatakan...
on 

thanx infonya sob..

Posting Komentar

 

Komentar Terbaru

Belum gabung di blog ini? buruan gabung!