Blog Tutorial

Tutorial Blog, Cheat Games, Tutorial Ponsel, Tutorial Komputer, Tutorial Browser

Jumat, 08 April 2011

Continuous Reel Slideshow For Blogspot

Kategori : , ,
Perkembangan Javascript menjadi fenomenal dikalangan Web. Javascript dapat membuat blog kita menjadi lebih aktif dan menarik untuk di kunjungi. Namun Javasript pun dapat membuat blog kita menjadi berat apabila kita memakainya berlebihan seperti penumpukan penggunaan javascript yang sama pada web/blog kamu. Jadi efesienkan penggunaan javascript pada web/blog kamu.

saya mempunyai trik yang cukup menarik tentang Javascript yang dapat membuat blog kamu menjadi lebih ciamik, apa itu? Continuous Reel Slideshow For Blogspot adalah jenis slide show yang menggunakan ajax dan javascript yang sederhana sehingga apabila kita menggunakan di blog maka pengaruh terhadap loading blog tidak terlalu berat tapi tetap saja apabila kita memakai javascript yang berlibihan. baik, langsung saja kita lihat cara pemasangannya pada blogspot.
  1. Kamu harus login terlebih dahulu di Blogspot, tentunya dengan akun kamu sendiri y
  2. Setelah itu kamu masuk ke halaman Elemen Halaman, bagaimana cara mengaksesnya? Klik Tulisan Rancangan saja dan biasanya sudah berada pada halaman Elemen Halaman
    Rancangan

  3. Lalu, tambahkan sebuah gadget, untuk tempat kamu bisa memilih dimana saja, saran saya tambahkan gadget di sidebar, Pada Windows baru setelah mengklik tulisan Tambah Gadget, kamu pilih yang HTML/Javascript lalu masukan kode di bawah ini

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

    <style type="text/css">

    #myreel{ /*sample CSS for demo*/
    border:15px solid black;
    }

    .paginate{
    width: 330px;
    margin-top:5px;
    font:bold 14px Arial;
    text-align:center;
    }

    </style>

    <script src="http://oketrik.googlecode.com/files/reelslideshow.js" type="text/javascript">

    /***********************************************
    * Continuous Reel Slideshow- © Dynamic Drive (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit http://www.dynamicdrive.com/ for this script and 100s more.
    ***********************************************/

    </script>

    <script type="text/javascript">

    var firstreel=new reelslideshow({
    wrapperid: "myreel", //ID of blank DIV on page to house Slideshow
    dimensions: [300, 200], //width/height of gallery in pixels. Should reflect dimensions of largest image
    imagearray: [
    ["http://i26.tinypic.com/11l7ls0.jpg"], //["image_path", "optional_link", "optional_target"]
    ["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new"],
    ["https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi1sK_vaLBhSktxx2W0ijU30DG2vJ-eT8yJmT2K_XAgF7Ykk9vLDYzATI5QPXSLT_VXKvupBGOURDmDnNrQo5kvRcYa0SQxVNkAzLKZCkUWWX9O-Q3dS2yBWXfikLlmLpmpJA-nxUzDK9u1/s1600-r/Header.png"],
    ["http://i31.tinypic.com/119w28m.jpg"] //<--no trailing comma after very last image element!
    ],
    displaymode: {type:'auto', pause:2000, cycles:2, pauseonmouseover:true},
    orientation: "h", //Valid values: "h" or "v"
    persist: true, //remember last viewed slide and recall within same session?
    slideduration: 300 //transition duration (milliseconds)
    })

    </script>
    <div id="myreel"></div>

    <div class="paginate">
    << <a href="javascript:firstreel.navigate('back')" style="margin-right:200px;">Previous</a> <a href="javascript:firstreel.navigate('forth')">Next</a> >>
    </div>

    Tambah Sebuah gadget
    HTML/javascriptSimpan


    Catatan :
    • Kode yang berwarna merah, menunjukan alamat gambar, jadi kamu bisa menggantinya dengan alamat gambar yang kamu miliki.

  4. Lalu simpan dan lihat hasilnya
Dengan menambahkan Continuous Reel Slideshow For Blogspot di blog kamu, blog kamu mempunyai daya tarik tersendiri sehingga ada kemungkinan hal ini meningkatkan trafik blog kamu. Mungkin hanya itu saja yang bisa saya sampaikan kurang lebihnya mohon maaf, Terima Kasih.
Bagikan Artikel : Facebook Twitter Google+ Linkedin Technorati Digg

4 Komentar untuk Continuous Reel Slideshow For Blogspot

wah perlu di coba tuh.....
tapi artkel ane baru terus sedikit lagi....
tapi thnk atas infonya...
salm blogger

gpp sob, keep post aja n semangat buat mosting ^_^
sama - sama

jalan2 sore hari ketempat sahabat... ditunggu kunjungan balikknya di blog sederhana saya...

kereen dah ...belum pake blogspot sih ane ...jadi tertarik euy..