Cara Membuat Gambar dan Teks Bisa di Drag

Senin, 23 April 2012

Oke sob postingan kali ini saya mau share nieh Cara Membuat Gambar dan Teks Bisa di Drag udah ada yang tau, atau belum tau sama sekali, oke lanjut saja ke tutorial berikut sobat blogger ...
Untuk demonya agan test sendiri ea soalnya template ini tidak cocok meletakan code tersebut, dijamin bisa koq ...

Login dulu di Blogger dengan akun anda.
Pada dashboard pilih Rancangan >> edit HTML
Jangan lupa Centang Expand Template Widget
Klik Download template lengkap untuk jaga-jaga.
Sekarang pasang Css kode dibawah ini diatas kode ]]></b:skin>

.drag_gambar img { cursor: move;}

Selanjutnya simpan script berikut diatas kode </head>

        <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js' type='text/javascript'/>
        <script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' type='text/javascript'/>
        <script type='text/javascript'>
        $(document).ready(function() {
        $("div.drag_gambar img").draggable();
        });
        </script>

    Keterangan :
    Perhatikan kode script berwarna Biru diatas, jika pada template anda sudah terdapat script tersebut, jangan dipasang lagi, pasang saja script yang berwarna merah.

    Kemudian klik Save/Simpan Template
    Untuk penggunaannya pada gambar, anda bisa menggunakan kode berikut :

<div class='drag_gambar'><img alt='KETERANGAN GAMBAR' src='URL GAMBAR'/></div>

Mudah bukan, tutorial ini sangat sederhana dan bisa memperindah tampilan gambar yang ada di artikel anda. Jika ada yang mau ditanyakan silahkan untuk mengisi kotak komentar yang ada di bawah. Selamat mencoba dan semoga bermanfaat.

Ditulis Oleh : Unknown ~ Tips dan Trik Blogspot

Sobat sedang membaca artikel tentang Cara Membuat Gambar dan Teks Bisa di Drag. Oleh Admin, Sobat diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link dibawah ini sebagai sumbernya

<a href="https://bungkaryo.blogspot.com/2012/04/cara-membuat-gambar-dan-teks-bisa-di.html" target="_blank">Cara Membuat Gambar dan Teks Bisa di Drag</a>

:: Get this widget ! ::

- Reviewer: Unknown - ItemReviewed: Cara Membuat Gambar dan Teks Bisa di Drag

Share this article :

BlogKaryo