Tutorial Blog

Cara Menciptakan atau Membuat Menu Tab View

Karena sering ditanya wacana bagaimana caranya menciptakan Tab VIew (Biasanya nanyanya gini: “Mas cara menciptakan sajian yg kayak punya mas gmn? yg ada “Tips & Trik”, “Lain-lain”, “Terbaru”, “Komentar” itu lho). Ya kan? hayo ngaku… Tabview itu sangat berkhasiat sekali, alasannya yakni dengan ukuran kotak yang relatif kecil tapi dapat memuat isi yang buanyak.

Sebenarnya dah dari dulu pingin posting wacana itu, tp alasannya yakni yg dulu cara pasanganya sulit jadi belum dapat saya jelaskan. Trus risikonya saya menemukan metode gres dalam pembuatannya. Cara yang ini mungkin ibarat dengan punyanya o-om, tp scriptnya agak beda. Dan saya dapet script ini juga bukan dari o-om lho 😀
Tab view itu misalnya ibarat ini :

Karena sering ditanya wacana bagaimana caranya menciptakan Tab VIew (Biasanya nanyanya gini: "Mas cara menciptakan sajian yg kayak punya mas gmn? yg ada "Tips & Trik", "Lain-lain", "Terbaru", "Komentar" itu lho). Ya kan? hayo ngaku... Tabview itu sangat berkhasiat sekali, alasannya yakni dengan ukuran kotak yang relatif kecil tapi dapat memuat isi yang buanyak.   Sebenarnya dah dari dulu pingin posting wacana itu, tp alasannya yakni yg dulu cara pasanganya sulit jadi belum dapat saya jelaskan. Trus risikonya saya menemukan metode gres dalam pembuatannya. Cara yang ini mungkin ibarat dengan punyanya o-om, tp scriptnya agak beda. Dan saya dapet script ini juga bukan dari o-om lho :D

DISINI
5. Langkah selanjutnya yaitu pasang instruksi berikut ini sebelum instruksi </head>

<script src=’http://kendhin.googlepages.com/tabview.js’ type=’text/javascript’/>

6. Kemudian “Di save”
7. Lalu pergi ke sajian “Page Elements”
8. Trus PIlih “Add a Gadget” –> “HTML/Javascript” di daerah yg akan km letakkan Manu Tab View ini.
9. Inilah script yg harus kau pasang :


<form action=”tabview.html” method=”get”>
<div class=”TabView” id=”TabView”>
<div class=”Tabs” style=”width: 350px;”>
<a>Tab 1</a>
<a>Tab 2</a>
<a>Tab 3</a>

</div>
<div class=”Pages” style=”width: 350px; height: 250px;”>

<div class=”Page”>
<div class=”Pad”>
Tab 1.1 <br />
Tab 1.2 <br />
Tab 1.3 <br />

</div>
</div>

<div class=”Page”>
<div class=”Pad”>
Tab 2.1 <br />
Tab 2.2 <br />
Tab 2.3 <br />

</div>
</div>

<div class=”Page”>
<div class=”Pad”>
Tab 3.1 <br />
Tab 3.2 <br />
Tab 3.3 <br />

</div>
</div>


</div>
</div>
</form>

<script type=”text/javascript”>
tabview_initialize(‘TabView’);
</script>

Rekomendasi :   Dasar Dasar Html

Keterangan :
– Angka2 atau text yang berwarna biru (350px) yakni ukuran tinggi dan lebar tabview.
– Kode yang berwarna Hijau Adalah text yang di Menu utama (Menu Atas).
– Kode yang berwarna merah yakni isi dari tabvie tsb. Kamu dapat mengisinya dengan link, gambar, banner, script dll.
– Untuk menmbahkan jumlah sajian maka perhatikanlah text yang berkedip2. tambahkan sajian tersebut dibawahnya.

Bagikan Postingan Ini:

Avatar

Bloggermyid

Bloggermyid.com merupakan sebuah platform online yang menyajikan beragam informasi teknologi, tips dan tutorial seputar komputer, internet, jaringan dan android. Serta informasi menarik lainnya mengenai perkembangan teknologi terkini.


Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Situs ini menggunakan Akismet untuk mengurangi spam. Pelajari bagaimana data komentar Anda diproses.

Eksplorasi konten lain dari Bloggermyid

Langganan sekarang agar bisa terus membaca dan mendapatkan akses ke semua arsip.

Lanjutkan membaca