PANDUAN,TIPS,TRIK DAN CARA MEMBUAT BLOG DENGAN MUDAH SERTA GRATIS

  • RSS
  • Delicious
  • Digg
  • Facebook
  • Twitter
  • Linkedin
  • Youtube

You need to upgrade your Flash Player to version 10 or newer.

MEMBERI EFEK GAMBAR BERJATUHAN PADA TEMPLATE BLOGSPOT

Seperti yang pernah saya postingkan beberapa waktu yang lalu mengenahai cara membuat efek salju pada blogspot ... kali ini saya akan berbagi kembali bagaimana cara membuat efek sendiri dengan foto atau gambar yang kita sukai berjumlah empat buah ,untuk contoh saya akan menggunakan gambar bunga yang berjatuhan ... karena obyrk akan mengarah dari atas ke bawah (berjatuhan)

Untuk menyingkat waktu silahkan ikuti petunjuknya
  1. Persiapkan gambar yang sudah anda upload secara on line karena kita akan membutuhkan alamat http-nya (url)
  2. >. Masuk keblogger dasbor anda
    >. Klik rancangan >> elemen halaman
    >. Tambah Gatget >> HTML/java script
    >. Copy dan pastekan kode script dibawah ini

    <script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>if(!image_urls){var image_urls=Array()}if(!flash_urls){var flash_urls=Array()}image_urls['rain1']="http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputrajpr.jpg";image_urls['rain2']="http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra-1.jpg";image_urls['rain3']="http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputrajpr.jpg";image_urls['rain4']="http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/redhead-edyputrajpr.jpg";$(document).ready(function(){var c=$(window).width();var d=$(window).height();var e=function(a,b){return Math.round(a+(Math.random()*(b-a)))};var f=function(a){setTimeout(function(){a.css({left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100)}).animate({top:(d-10)+'px'},e(7500,8000),function(){$(this).fadeOut('slow',function(){f(a)})})},e(1,8000))};$('<div></div>').attr('id','rainDiv')
    .css({position:'fixed',width:(c-20)+'px',height:'1px',left:'0px',top:'-5px',display:'block'}).appendTo('body');for(var i=1;i<=20;i++){var g=$('<img/>').attr('src',image_urls['rain'+e(1,4)])
    .css({position:'absolute',left:e(0,c)+'px',top:'-30px',display:'block',opacity:'0.'+e(10,100),'margin-left':0}).addClass('rainDrop').appendTo('#rainDiv');f(g);g=null};var h=0;var j=0;$(window).resize(function(){c=$(window).width();d=$(window).height()})});</script>
    <script>if(typeof jQuery=='undefined'){document.write('<'+'script');document.write(' language="javascript"');document.write(' type="text/javascript"');document.write(' src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">');document.write('</'+'script'+'>')}</script><script>$(document).ready(function(){var a=$('<img>').</script>
Ingat ..!! latar belakang gambar anda harus sesuai dengan warna template anda.

Silahkan liat DEMO

Untuk mengganti gambar silahkan anda pilih dibawah ini.

1. Photobucket
Alamat urlnya :http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/mawar-edyputra.jpg

2.Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/mawar-edyputra1.jpg

3.Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra-2.png

4. Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra-1.jpg

5.  Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputrajpr-1.jpg

6. Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputrajpr.jpg

7.  Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra1.jpg

8.  Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra2.jpg

Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra3.jpg

10.   Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/pinkpetal-edyputra.png

11.     Photobucket
Alamat urlnya :http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/redhead-edyputra.jpg

12.   Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/redhead-edyputrajpr.jpg

13    Photobucket
Alamat urlnya :http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/redpetal-edyputra-1.jpg

14.   Photobucket
Alamat urlnya : http://i728.photobucket.com/albums/ww287/edyputrajepara/Bunga/redpetal-edyputra.png


Ganti kode yang warna biru dengan gambar yang ingin kamu pakai,jika ingin gambar satu atau kurang dari empat gambar silahkan anda kosongkan saja alamat urlnya..(yang warna biru)




MY HOME , MY ALBUM , TUTORIAL BLOG , GAME , BENGKEL MOBIL , ISLAMIC

  • Share this
  • Sumbit to Digg
  • Sumbit to StumbleUpon
  • Sumbit to Delicious
  • Sumbit to Technorati
  • Sumbit to Reddit
  • Sumbit to Mixx
  • Sumbit to Twitter
  • Sumbit to Furl
  • Sumbit to Design Float
  • Sumbit to Blinklist
  • Sumbit to Yahoo Buzz
  • Sumbit to Google Bookmarks

Artikel Terkait

3 comments:

DbanditS said...

thx ya gan.....

lagi belajar ni gan,

maklumin dah klo ada salah2 dikit...

anticlockwise86 said...

makasih sobat buat tutorialanya

jum adi said...

Pumps For Industry distributor langsung dari pabrik klik http://trastisurabaya.blogspot.com/2012/10/blagdon-pump.html

Post a Comment

SILAHKAH COMEN DULU...
MAKASIH TELAH MEMBERI COMEN DAN WUKTUNYA....
SALAM PERSAHABATAN.....
edy putra Jl.cik lanang62 Kauman Rt04/05 Jepara-59417

CARI ARTIKEL DISINI By Google

Loading

    COMENTATOR

    CHAT ROOM

    CONTAC Edy putra