EnglishFrenchGermanSpainItalianDutchRussianBrazilJapaneseKoreanArabicChinese Simplified

Labels

Profil

Foto saya
Fauzi Maulana Akhyar, masih sekolah (sudah SMA kelas 2) masih belajar ngeblog
FA CORP. Diberdayakan oleh Blogger.
Flag Counter
Home » » Cara Membuat Menu Tab View

Cara Membuat Menu Tab View



Cara membuat Menu Tab View keren dengan Efek jQuery:


  • Buka Dasbor Blog anda.
  • Pilih menu tata Letak


Cara membuat Menu Tab View keren dengan Efek jQuery


  • Tambah Widget HTML/JavaScript.
  • Kemudian Copy Paste Kode dibawah ini kedalam Widget HTML/JavaScript tersebut:

<style type="text/css">
    .tabber {
     padding: 0px !important;
     border: 0 solid #bbb;
    }
    .tabber h2 {
     float: left;
     margin: 0 1px 0 0;
     font-size: 12px;
     padding: 3px 5px;
     border: 1px solid #bbb;
     margin-bottom: -1px;
     overflow: hidden;
     position: relative;
     background: #0000FF;
     cursor:pointer;
     -moz-border-radius:5px 5px 0 0;
     border-radius:5px 5px 0 0;
    }
    html .tabber h2.active {
     background: #000000;
     border-bottom: 1px solid #fff;
    }
    .tabber .widget-content {
     border: 1px solid #bbb;
     padding: 10px;
     background: #fff;
     clear:both;
     margin:0;
    }
    .codewidget, #codeholder {
     display:none; {
    </style>  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
    <script type="text/javascript" src="http://greenlava-code.googlecode.com/svn/trunk/publicscripts/bloggertabs0.1_min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
     $('#codeholder').bloggerTabber ({
      tabCount : 3
     });
    });
    </script><!-- Jangan hapus kode dibawah, agar widget bisa berfungsi --><div id='codeholder'><a href="http://www.bloggersentral.com/2011/05/create-tabbed-content-blogger-widgets.html" target="_blank"></a></div>

  • Simpan.
Catatan: Untuk menampilkan Menu seperti Popular Post, Category, Random Post dll. Silahkan anda letakkan Widget widget tersebut dibawah Widget Menu Tab View ini.

Cara membuat Menu Tab View keren dengan Efek jQuery

Sekian, Semoga bermanfaat!

0 komentar:

Posting Komentar