PartS LED . LCD

cari artikel disini

Minggu, 29 Januari 2012

Cara Membuat Navbar Melayang Seperti Facebook



Membuat Navbar melayang ala facebook - dapat membuat cantik tampilan blog kita. Selain cantik,yang paling penting adalah apa fungsinya? Melayang maksudnya,meskipun halaman di scrool ke bawah,tapi navbar tersebut masih tetap terlihat. Dan di navbar tersebut bisa di selipkan seperti, Translate, Share, Random post, facebook page dan lainnya. Bila Sobat Semua Menginginkan Tolbar Atau Navbar Tersebut, Sobat Bisa Mengikuti Langkah-Langkah Berikut:

1. Login Ke Akun "Blogger" Sobat
2. Pada "Dasbor" Pilih Rancangan Kemudian Pilih "Edit HTML"
3. Letakan CSS Berikut Tepat Diatas Kode ]]></b:skin>


/*-- CUSTOM NAVIGATION BAR--*/
* html #mta_bar{position:absolute}
#mta_bar{background:#000 url(http://3.bp.blogspot.com/_C6KkooKXCEw/TIBnl52l4iI/AAAAAAAAGx0/lVYBna0YOTI/s200/nav-background-c.png) top left repeat-x; border-bottom:1px solid #333; z-index:100; padding-top:6px; width:100%; top:0; left:0; overflow:auto; height:25px; overflow:hidden}
#mta_bar .bar_logo{background:url(http://1.bp.blogspot.com/_C6KkooKXCEw/SiwZH4BjB-I/AAAAAAAAEX4/qw31k-6bjzo/s400/feed.gif) 7px 2px no-repeat; float:left; padding-left:7px; text-align:left; font-family:Arial; font-size:14px; font-weight:bold; font-style:normal; color:#fff; width:200px; padding-left:20px;padding-top:1px}
#mta_bar .bar_logo a{text-decoration:none; color:#fff; padding-left:21px}
#mta_bar .bar_search{float:left; padding:0; margin:0; text-align:left; font-family:tahoma; font-size:14px; font-weight:bold; font-style:normal; color:#fff; width:165px}
#mta_bar .bar_search a{text-decoration:none; color:#fff; padding-left:21px; padding:0}
#mta_bar .bar_search a:hover{text-decoration:underline; color:#fff}
#mta_bar .bar_navbarmenuleft{float:right; text-align:left; font-family:tahoma; font-size:13px; font-weight:normal; font-style:normal; color:#999; width:468; padding:3px 1px}
#mta_bar .bar_submit{float:left; text-align:left; font-family:arial; font-size:13px; font-weight:normal; font-style:normal; color:#fff; padding:3px 0; width:140px}
#mta_bar .bar_submit a{background:url(http://2.bp.blogspot.com/_C6KkooKXCEw/SjNkb64JO4I/AAAAAAAAEbI/oALk2rlXwdg/s400/facebook.png) 0 no-repeat; text-decoration:none; color:#fff; padding-left:21px}
#mta_bar .bar_submit a:hover{text-decoration:underline; color:#fff}

/* SEARCH */
#search{border:1px solid #d1cdcd; height:18px; width:250px; padding:0; background:#f6f4f4; }
#search input{border:0; background:none; color:#575757}
#s{font-size:12px; width:230px; padding-left:4px; margin:0; background:none}
#topsearch #search{margin-top:0px;-moz-border-radius-bottomleft:3px;-moz-border-radius-bottomright:3px;-moz-border-radius-topleft:3px;-moz-border-radius-topright:3px;background-color:#FFFFFF;border:1px solid #000000;}
#topsearch #s{width:225px}
#footheader {
width: 100%;
float:left;
margin:0 0 0;
padding:0 0 0;
height:35px;
}
/* -- SET SMALL ICON-- */
#main .icon-demo-download {border:none; width:9px; height:9px; padding:0 0px; margin: 3px 0px 0 3px; vertical-align: top;}

#bottom-bottom{-moz-border-radius:4px; -khtml-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; letter-spacing:.0001em;font-size: 9pt;color:#ffffff;padding-left:10px;padding-right:10px; padding-top:10px; padding-bottom:10px; margin-bottom:5px; clear:both;
background:#111;
}


4. Kemudian Letakan Script Berikut Tepat Dibawah Kode <body>

<div id='mta_bar' style='position:fixed;'>
<div class='mta_bar bar_logo'>
<a href='
http://imeldaentertainment.blogspot.com/ '>Homel</a>
</div>
<div class='mta_bar bar_search'>
<div id='topsearch'>
<div id='search'>
<form action='
http://imeldaentertainment.blogspot.com/ search' id='searchform' method='get' name='searchform'>
<input class='keyword' id='s' name='q' onblur='if (this.value == &quot;&quot;) {this.value = &quot;search..&quot;;}' onfocus='if (this.value == &quot;Cari disini..&quot;) {this.value = &quot;&quot;}' type='text' value='Cari disini..'/>
<input src='http://4.bp.blogspot.com/_C6KkooKXCEw/S_ux4s60thI/AAAAAAAAF0o/cifM6NFq5S8/s1600/search.gif' style='border: 0pt none ; vertical-align: top; padding-top:3px' type='image'/>

</form>
</div>
</div>
</div>
<div class='mta_bar bar_share'>
xxxxxxxx
</div>
<div class='mta_bar bar_GoogleAds'>
xxxxxxx
</div>
</div> 



5. Ganti URL yang bewarna merah dengan URL sobat 
6. Simpan dan selesai deh...
Selamat Mencoba yah...

2 komentar:

  1. Terimakasih sob. Lebih baik tulisannya diperjelas lagi. jangan pake block putih. Kunjungan balik ya... netfori.blogspot.com

    BalasHapus
  2. maksih atas koreksi nya" maaf banget ni gara2 ganti template jd banayk yg eror tek nya" ok mksh atas kunjungan nya di tunggu!!

    BalasHapus

Terima kasih atas komentar anda salam sahabat!!! Rudi thea

Follow by Email

Next

Artikel yang mungkin belum Anda baca

Terbaru

Get this widget here

cartegori

Access 2013 (1) air terjun (2) AIWA AKARI AKIRA (1) alam indonesia (2) alat2 rumahtangga dan listrik (4) aneh tapi langka (1) aneh tapi nyata (3) animasi (4) Antariksa (3) artikel ku (1) artis indonesia (1) bagai mana cara mencari kerusakan tv (41) bagian prosesor luminance (Y) (3) BEBERAPA PERSAMAAN IC VERTIKAL (1) Bencana alam (6) Berita-tekhnologi (36) bertia sukabumi (3) bisnis (2) bisnis online (7) bmkg (1) book speker (1) brisat (2) bunga aneh (3) bus (1) cara buang virus ponsel (1) cara membuat gemuk (1) Cara mengganti nama blog (2) CARA MERAKIT SEMATIK TV (11) cara serpis dvd (18) cara service (12) cara service tv(elektronics) (166) cara servis monitor (10) cara setting lewat menu factory tv (13) CHINA BRAND (1) Crara Service Mode Tv (3) crt (3) CTV Polytron (6) daerah (3) dan fb (1) Dekorasi (enetrtainment) (4) digitec (2) DMX Mixer 192 (1) Dunia (1) dvb (2) DVD programming (14) Excel 2013 (1) facebook internet (15) facebook timeline (1) feedback destroyer (2) gacun (1) garis besar bagian lemari es (1) garis besar mesin tv (7) garits video gratis audio (9) GOLDSTAR HITACHI JVC LG (3) gratis dwnload (2) html (5) IC (1) imelda (1) intel (1) internasional (8) internet mobile (10) inverter (1) jabar (55) jalan raya (1) jejaring sosial (1) kata kata ucapan selamat tidur yang romantis (3) kata mutiara (1) kecelakaan (12) kerusakan haredware komputer (43) kerusakan lcd monitor (3) KERUSAKAN software TV (8) kerusan tv dan penyebab nya (48) kilas berita (147) kode ponsel (1) kode remote. (3) kode servis (4) KODE TV (2) koneksi internet (32) lampu neon (2) LED Par (1) link ku (1) macam macam kerusakan tv (23) manca negara (2) manfaat tumbuhan buat kesehatan (12) MENGENAL MENGUKUR KOMPONEN ELEKTRONIKA DASAR (19) menurut penalaman (2) mesum (2) mic wirles (1) Microsoft Office (1) minimax (4) mixser (1) modem (1) MODIPIKASI TV (8) nasional (82) olah raga (1) OneNote 2013 (1) OPTION SETTING tv tcl (1) otomotip (1) Outlook 2013 (1) panasonic (1) PANASONIC POLYTRON (1) Pasang Sendiri Parabola (2) pbt (1) pemancar (2) PERKEMBANGAN ELEKTRONIC (4) persamaan ic (3) PERSAMAAN TR HORIZONTAL (1) photo bugil (1) photo edit (2) pla (1) plash message teks berjalan (1) Playstation (1) plyback (2) politik (1) polytron (10) polytron data servis (5) polytron u slim gambar melengkung. (5) poto (6) poto artis sexi (4) poto sexi (3) power (15) power splay (6) PowerPoint 2013 (1) Project 2013 (1) Publisher 2013 (1) rangkain inverter (3) raster gelap (1) remot control (2) remot tv (2) REMOT UNIVERSAL (1) resistor (3) sains (1) SAMSUNG SANYO (1) satelit (2) satelit Rusia Techno (2) seputar entertainment (10) serba gratis.cari yg gratis. video baru. mp3.pemutar mp3. mp3 gratis. (13) Service Menu Philips (1) Service Mode LCD Monitor (2) servis lcd monitor (3) SERVIS MODE (10) sharp (2) SHARP SONY TCL (1) siaran tv analog (2) siaran tv digital (2) skema (3) sms gratis (2) software gratis (3) sound system (15) STB DVB-T2 (1) stelit (1) subwoper (1) Sukabumi (10) susnan perangkat audio di lapangan (1) tan (1) tanaman aneh (3) tcl (4) televisi dan keluarga (7) telkomsel (1) tempat wisata alam (7) Tips Blog/webssite (51) Tips Blog/webssite/html (34) Tips pertanian (6) tips software komputer (57) tips trik elektronic (27) tips trik facebook (10) tips trik komputer (44) TOSHIBA (1) tours (1) trafo (1) transtistor (5) trapo (5) tutorial blog (7) tv china (14) tv komputer (4) tv lg (3) TV MENU SERVIS KODE (15) TV SHARP Protec (2) tv tcl (1) twetter (1) ucapan hari raya idul fitri (3) ucapan selamat (4) ucapan selamat hari ibu (1) ucapan selamat hari raya idul adha (1) ucapan selamat tidur buat pacar (2) ucapan selamat tidur untuk kekasih (3) ucapan tahun baru (1) ulang tahun (1) universal (1) video porno (1) Visio 2013 (1) Widget Check Berat Blog (2) Windows 8 (11) Wisata Baharia (3) wisata sukabumi (2) wisaya sukabumi (1) Word 2013 (1)

Entri Populer