Lazada Indonesia

30 CSS Tab dan Menu Navigator

Tadinya aku bingung cari kata kunci untuk artikel ini di Search Google...setelah 17 jam mencari akhirnya ketemu rumahnya kg ocim ini (nah...ini yg sy cari..)...maklumlah..baru hare gene belajar ilmu tekhnologi Photobucket Kata kunci yg sy ketik seperti ini : membuat menu snapshot ( gak ada ), membuat menu aplikasi ( salah alamat ), membuat menu hilang timbul ( eeeeee...malah ntah kemana larinya), udah lama baru sy ingat "loh...itukan pake script" makanya sy ketik kata kunci seperti ini "script untuk menu navigator blogger" ( nah..ketemu rumahnya kg ocim/urutan paling atas lagi...) langsung sy copypaste ke blog ini ( agar ingat truuuus ) makci ya kg ocim.

Nah...ini hasil tulisan tersebut :
Tab navigasi merupakan bentuk navigasi dan sekelompok link yang memberikan kesan sebagai proyeksi terpasang ke berbagai link konten. Ada berbagai jenis tab navigasi berbasis desain tersedia untuk digunakan oleh Anda apabila mencarinya diinternet. Sementara beberapa menggunakan CSS dan Javascript tradisional, beberapa tab dimungkinkan mwnggunakan AJAX yang membuat mereka adorable dan lebih mudah digunakan.

Berikut adalah daftar berbasis CSS dan Ajax tab yang saya temukan, yang mungkin berguna bagi Anda untuk digunakan di situs / blog agar lebih menarik.

1. CSS Driven tabs : Just pure HTML & CSS

CSS Driven tabs2. Hidden Tab Menu : tab ini tidak dapat dikatakan sebagai contoh murni berbasis tab navigasi. Tetapi dengan cara penyajiaannya, tab tsb menampilkan menu dan hovering mouse yang menampilkan menu tersembunyi, dapat dianggap sebagai semacam tab menu.

Hidden Tab Menu 3. Updated Simple CSS Tabs : Tab ini menyediakan tab dengan nested Menus di setiap tab di bagian atas konten.

Updated Simple CSS Tabs4. CSS Tabs with Sub-menus : Bentuk Tab Navigasi yang sederhana, tetapimeiliki bentuk yang unik.

CSS Tabs with Submenus5. Simple CSS Tabs : di mana pengguna dapat mengklik pada setiap tab untuk melihat konten yang berbeda dalam ruang yang sama.

Simple CSS Tabs6. Close Tabs and Add New Tabs Dynamically :
Anda bisa Tutup Tab atau Tambah sebuah Tab Baru menggunakan Tab ini, yang menggunakan Javascript untuk menghapus atau membuat tab baru secara dinamis. Yang merugikan adalah bahwa isi dalam tab berasal dari eksternal file.

Close Tabs and Add New Tabs Dynamically7. Ajax Tab Content : Ini adalah Ajax Tabs Content script serbaguna yang dapat digunakan untuk menampilkan konten yang diambil dari file eksternal didalam Div dan disusun melalui CSS tab. CSS dan HTML berbasis script, mendukung fitur praktis seperti kegigihan dari tab yang aktif (yaitu ketika halaman direfresh), sebuah "IFRAME" Modus, sebuah "slide-show" Modus, kemampuan untuk memperluas / kontrak acak DIVs pada halaman pada saat yang sama, nested tab, dan banyak lagi. Terinspirasi dari Yahoo homepage, yang mempekerjakan seperti konsep untuk menampilkan berita yang disusun dalam mode.

Ajax Tab Content 8. Rotating UI Tabs : Tab biasanya digunakan untuk menghemat ruang. Secara normal tab widget akan bertukar antara tab bagian onclick, namun dapat jg diubah ke onHover melalui salah satu pilihan. Tab konten dapat diambil melalui Ajax dengan menetapkan suatu href pada tab. Tab tab mendukung memuat konten melalui Ajax.

Rotating UI Tabs9. Easy Tabs 1.2 – With Autochange: Sekarang Anda dapat mengatur secara otomatis mengubah modus ke salah satu menu, dan kompatibel dengan semua browser seperti biasanya.

Easy Tabs 1.2 - With Autochange10. Slideshow Tabs: Mendukung "slideshow" mode, di mana skrip secara otomatis melalui siklus dan memilih secara berkala setiap tab sampai tab adalah dipilih secara eksplisit.

Slideshow Tabs11. Sliding Tabs : Sliding Tabsis kepunyaan mootools 1,11 plug-in yang menambah kesan cantik rapi, yang pada gilirannya akan sangat mirip dengan widget yang digunakan di iTunes Music Store

Sliding Tabs12. JQuery TabContainer: Menerapkan gaya JQuery animasi yang berjalan sebagai pengguna menavigasi antara tab yang dipilih. Anda dapat menambahkan animasi transisi ke tab yang ada Tab Panel Kontrol.

JQuery TabContainer13. Accordion Style Tabs : Tab yang aktif dengan efek accordion seperti suing moo.fx library.

Accordion Style Tabs14. Yahoo! UI Library: TabView : TabView komponen yang dirancang untuk memungkinkan para pengembang untuk membuat tab dpt dilihat dari konten.

15. Fancy Sliding Tab Menu : Menu dikembangkan di script.aculo.us dan memiliki beberapa fitur tambahan seperti yang diminta di comment setelah versi terakhir theFancy Sliding Tab Menu.

Fancy Sliding Tab Menu16. Control.Tabs : Control.Tabs membuat tab antarmuka dari daftar link yang mengarah ke setiap elemen pada halaman yang memiliki atribut id. Karena perintah ini mengarah ke HTML yang sudah memiliki arti semantik, ia akan menurunkan keindahan untuk browser yang tidak mendukung JavaScript, dan browser yang ramah.

Control.Tabs17. Zapatec AJAX Tabs : Zapatec AJAX menurut saya simple dan terlihat dinamis.

Zapatec AJAX Tabs18. ExtJS Advanced Tabs : TabPanel yang dibuat menggunakan bahasa Javascript.

ExtJS Advanced Tabs19. jQuery Tabs: plugin sederhana yang diakses javascript tabs menggunakan jQuery.

jQuery Tabs20. dhtmlxTabbar: JavaScript tabbar kontrol dinamis untuk membuat tab-navigasi interface. Ajax ini diaktifkan UI-komponen dapat digunakan untuk menambahkan fitur dan enak dilihat ke situs web atau aplikasi lainnya.

dhtmlxTabbar21. Centered Tab dengan CSS: Tab navigasi yang berorientasi di tengah.

Centered Tabs with CSS22. CSS Tab Designer: CSS Tab Designer adalah unik dan mudah untuk menggunakan perangkat lunak untuk membantu Anda merancang css berbasis daftar dan tab visual tanpa diperlukan pengetahuan programming !

CSS Tab Designer 23. Light Weight Low Tech CSS Tabs : Contoh light weight tabs dengan menggabungkan metode yang Sliding Doors Mountaintop dengan ide di pinggir.

Light Weight Low Tech CSS Tabs 24. Module Tabs – Carousel : Contoh menampilkan satu halaman konten dgn pengaturan waktu di dalam tab. Setiap tab Scrolls melink ke halaman yang dipilih. Karena semua animasi dimatikan (animationSpeed = 0) maka hanya bergerak ke konten yang dikehendaki akan dilihat.

Module Tabs - Carousel 25. Navigasi tab Menggunakan CSS : tab navigasi dgn membuat bandwidth yg rendah di halaman web menggunakan CSS. Sebagai tambahan bonus Anda juga akan mempelajari cara untuk beralih tab tanpa memuat halaman lebih dari satu kali.

Tabbed Navigation Using CSS26. Duoh’s 2nd Level Tab Menu : tampilan yang sedikit seperti bahasa mesin.

Duoh’s 2nd Level Tab Menu27. Bulletproof Slants : Desain yang cepat, mudah dan fleksibel.

Bulletproof Slants28. CSS Menus v2 : Dynamic menu contoh yang digerakkan sepenuhnya oleh CSS dan bekerja di semua browsers. Internet Explorer sebagai pengecualian, tentu saja. IE6 memerlukan beberapa "hover" bantuan, dan IE 7 z-indeks terdapat beberapa bug/ error.

CSS Menus v229. CSS Tab Menu dengan Dropdowns : membuat menu dropdowns hovered diatas. Ini menggunakan metode Suckerfish untuk dropdowns, seperti terlihat pada HTML Dog.

CSS Tabs Menu with Dropdowns30. Fleksibel Navigasi: Navigation bar menggunakan bakground gambar, sedikit CSS dan JavaScript.

Flexible Navigation
Photobucket

Silahkan anda berkomentar. Komentar Anda akan langsung muncul. Anda bisa memasukkan link kedalam tulisan di komentar anda. Bukan hanya "link", anda juga bisa memasukkan Batu, Bata, Perhiasan, Balok, Pesawat, Mobil...dll ke dalam kotak komentar.