Search here

Type a word related to the post, then click the search button !

Memuat...
English
Bru masuk angin!

Arsip...

Flag Counters

Flag Counter

Pengikut

Recent Comments plus Kode CSS Box Gelap

Recent Comments

blog-indonesia.com

Vertical Menu

CLICK any categories for open!
Gubhug Reyot

Sobat Ngeblogh

Sobat Ngeblogh

Buat sobat blogger yang mau ikutan jadi follower silahkan KLIK link Follower (Follow) di ujung kanan-bawah. Dari hasil monitoring, ternyata yang link-nya telah dimasukkan ke "Sobat Ngeblogh" mengalami pertambahan pengunjung secara signifikan!
Terima kasih .: Salam :.
gubhug reyot

Scrolling with Fade Out Effect

Scrolling with Fade Out Effect menciptakan effect blur pada sisi atas dan sisi bawah scroller ketika dilakukan penggeseran. Effrect ini tercipta karena penggunaan background image transparan di kedua ujung scroller dengan background berbentuk file png.

Untuk menciptaan effect blur secara lebih luas dilakukan dengan melakukan perubahan tinggi background image di ke dua ujung scroller.

Langkah untuk membuat Scrolling with Fade Out Effect :

1. Amankan Template terlebih dahulu! Silahkan caranya lihat di sini.

2. Tetap di Edit HTML kemudian cari KODE ]]></b:skin>.

3. Copy paste KODE CSS di bawah ini dan letakkan persis di atasnya.

KODE CSS Scrolling with Fade Out Effect :

.ScFadeout { 
width:300px;
position:relative;
margin:25px auto 100px auto;
ext-align:left;
border-right:20px solid #333;
background: #999999 url(http://i45.tinypic.com/20p44h.gif);
border-top:1px solid #33CCFF;
border-left: 1px solid #33CCFF;
border-bottom: 1px solid #33CCFF;
}
.artikel {
text-align:left;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color: #0033FF;
padding:0 10px 50px 10px;
background:url(http://i45.tinypic.com/20p44h.gif);
width:300px;
height:250px;
overflow: auto;
}
.topeffect {
position: absolute;
height: 40px;
width:100%;
top:0; left:0;
background:url(http://i46.tinypic.com/j7gfm9.png);
}
.bottomeffect {
position: absolute;
height: 40px;
width:100%;
bottom:0; left:0;
background:url(http://i50.tinypic.com/2iafvxd.png);
}
.artikel h1 {margin:20px 10px 10px; color:#FF0000;}

4. KLIK Simpan Template.

5. Gunakan KODE HTML berikut di bagian body di antara tag <body> dan tag </body> atau pada saat posting.

xHTML dan Scrolling with Fade Out Effect :

<div class="ScFadeout">
<div class="topeffect"></div>
<div class="bottomeffect"></div>
<div class="artikel">
<h1>Judul Artikel</h1>
<h3>Teks tambahan !</h3>
Tuliskan Teks di sini !
Tuliskan Teks di sini !
Tuliskan Teks di sini !
Tuliskan Teks di sini !
<img class="art" src="Image.jpg" width="260" style="border:10px solid #666666;"/>
</div>
</div>

Catatan :

1. Atur tinggi Scrolling with Fade Out Effect dengan merubah nilai height pada KODE CSS di syntax :

.artikel {
.
.
height:250px;
}

2. Untuk memperluas ruang effect blur di kedua ujung atas dan bawah scroller, harus dilakukan perubahan ukuran gambar (image) background topeffect dan bottom effect. Tentunya ini harus dilakukan dengan melakukan edit ulang pada background gambarnya untuk selanjutnya di upload di image hosting.

3. Setelah background mage diupload, rubah ukuran tinggi (height:40px) pada KODE CSS di bottomeffect dan top effect sesuai tinggi gambar yang baru.
4. Selamat berkarya dan SUXES untuk anda !!

4 komentar:

  1. makasih bang ane dah bisa, heheheee dan sedikit modif ini script ok punya...mahesa (makin hebat saja). ijin untuk menampilkan di posting ane makasih

    BalasHapus
  2. makasih sebelumnya bang...,mo minta ijin untuk copy paste...
    muantap blognya...

    BalasHapus
  3. g mna mas koq gag jdi yg animasi kursor

    BalasHapus
    Balasan
    1. saya ingin berbagi cerita kepada semua teman-teman bahwa saya yg dulunya orang yg paling tersusah,walaupun mau makan itu pun harus hutang dulu sama tetangga dan syukur kalau ada yg mau kasi,semakin aku berusaha semakin jauh juga pekerjaan dan selama aku ingin berbuat baik kepada orang lain semakin banyak pula yg membenci saya karna saya cuma dianggap rendah sama orang lain karna saya tidak punya apa-apa,dan akhirnya saya berencana untuk pergi mencari dukun yg bisa menembus nomor dan disuatu hari saya bertemu sama orang yg pernah dibantu sama MBAH KABOIRENG dan dia memberikan nomor MBAH KABOIRENG,dia bilan kepada saya kalau MBAH KABOIRENG bisa membantu orang yg lagi kesusahan dan tidak berpikir panjang lebar lagi saya langsun menghubungi MBAH KABOIRENG dan dengan senan hati MBAH KABOIRENG ingin membantu saya,,alhamdulillah saya sudah menang togel yg ke5 kalinya dan rencana saya bersama keluarga ingin membuka usaha dan para teman-teman diluar sana yg ingin seperti saya silahkan hubungi MBAH KABOIRENG di 085=260=482=111 saya sangat bersyukur kepada allah karna melalui bantuan MBAH KABOIRENG dan kini kehidupan saya sudah jauh lebih baik dari sebelumnya,ingat kesempatan tdk akan datan untuk yg kedua kalinya.. KLIK TOGEL 2D 3D 4D 6D DISINI













      saya ingin berbagi cerita kepada semua teman-teman bahwa saya yg dulunya orang yg paling tersusah,walaupun mau makan itu pun harus hutang dulu sama tetangga dan syukur kalau ada yg mau kasi,semakin aku berusaha semakin jauh juga pekerjaan dan selama aku ingin berbuat baik kepada orang lain semakin banyak pula yg membenci saya karna saya cuma dianggap rendah sama orang lain karna saya tidak punya apa-apa,dan akhirnya saya berencana untuk pergi mencari dukun yg bisa menembus nomor dan disuatu hari saya bertemu sama orang yg pernah dibantu sama MBAH KABOIRENG dan dia memberikan nomor MBAH KABOIRENG,dia bilan kepada saya kalau MBAH KABOIRENG bisa membantu orang yg lagi kesusahan dan tidak berpikir panjang lebar lagi saya langsun menghubungi MBAH KABOIRENG dan dengan senan hati MBAH KABOIRENG ingin membantu saya,,alhamdulillah saya sudah menang togel yg ke5 kalinya dan rencana saya bersama keluarga ingin membuka usaha dan para teman-teman diluar sana yg ingin seperti saya silahkan hubungi MBAH KABOIRENG di 085=260=482=111 saya sangat bersyukur kepada allah karna melalui bantuan MBAH KABOIRENG dan kini kehidupan saya sudah jauh lebih baik dari sebelumnya,ingat kesempatan tdk akan datan untuk yg kedua kalinya.. KLIK TOGEL 2D 3D 4D 6D DISINI



      Hapus

 
GR | Edited by | gubhug reyot