Cara Membuat Iklan Melayang Floating dengan CSS Tanpa JQuery



Cara Membuat Iklan Melayang Floating dengan CSS Tanpa JQuery supaya lebih enteng.
halo sobat blogger kembali lagi kali ini kang niam ingin bagi-bagi tips buat kawan-kawan yang setia berkunjung ke niamblog, sebelumnya saya pernah posting Cara membuat iklan melayang dengan javascript kali kita akan membuat iklan melayang dalam bahasa gaulnya floating atau apalah saya juga gak mudeng, mungkin sobat pernah membuat iklan melayang, nah disini mungkin cara membuatnya agak sedikit berbeda dengan cara membuat iklan melayang yang banyak dilakukan para sobat blogger, biasanya kita membuat iklan melayang itu menggunakan javascript jquery.js maka tips kali ini adalah hanya dengan CSS saja dan sedikit javascript plus HTML, yang pasti tidak menggunakan jQuery yang memberatkan blog saat di load.
Langkah1
Masuk Dasboard >> Rancangan >> Edit HTML lalu Expand Widget Templates
Langkah2
Cari Kode seperti ini:
]]></b:skin>

Kalo Udah ketemu tambahkan kode Css dibawah ini tepat diatasnya:
#floating-ads {
position:fixed;_position:absolute;bottom:80px; left:120px;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
.bgfloat{}
Bila dah selesai Save Template kamu.
Langkah3
Sekarang masuk Rancangan >> Elemen Laman >> tambahkan Gadget >> pilih Javascript/HTML.
Lalu masukkan kode dibawah ini didalamnya.
 
<script language="javascript">
function closeTopAds() {
document.getElementById("floating-ads").style.visibility = "hidden";
}
</script>
<div id="floating-ads">
<div align="center" class="bgfloat"><img align="absmiddle" onclick="closeTopAds();return false;" src="http://lh6.ggpht.com/_IjrRiI_bVb0/SxtblET-xfI/AAAAAAAACVQ/1i0rufnJAP4/minimize.png" style="cursor: pointer;" />
</div>
KODE IKLAN DISINI
</div>

Langkah4
Save pekerjaan kamu.
! Letakkan kode iklan sobat pada tulisan “Kode Iklan Disini”, dan untuk mengatur iklan sesuai dengan template kamu silahkan diserasikan kode CSSnya dengan Template sobat, karena biasanya ada template yang berbeda.
ini kode yang perlu kamu rubah bila iklannya kurang ke kanan atau ke kiri atau kebawah atau keatas.
1
bottom:80px; left:120px;
Selamat mencoba dan semoga tips yang saya berikan bermanfaat untuk sobat blogger.


Responses

0 Respones to "Cara Membuat Iklan Melayang Floating dengan CSS Tanpa JQuery"

Posting Komentar

•Sangat Saya Hormati Jika Anda Meninggalkan Komentar di Blog ini

•Mohon Maaf Blog ini Tidak Terima Komentar yang Mengandung Sara , Spamming , Flamming

•Kritik Dan Saran Dari Pembaca Semoga Bisa Membantu Memajukan Blog Ini

Regards : ~Sofyan_oZ~

 

Statistic Blog's



Free Page Rank Tool
Return to top of page Copyright © 2012 Always-Sharing | Blogspot Tutorial | From Zero To Hero | Template by HackTutors