12.9.11

Make Draggable Image with jQuery-ui

Tutorial berikut akan bercerita bagaimana cara men-drag image dengan jquery-ui script. Sobat hanya memerlukan bahan-bahan sebagai berikut
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js' type='text/javascript'></script>
<script src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(document).ready(function() {
$(".dragMove img").draggable();
});
</script>
Bubuhkan sedikit CSS style diatas kode ]]></b:skin>
.dragMove img {
cursor: move;
<!-- your variabel add here -->
}

Kalian bisa memvariasikan dengan variabel lainnya ;) Kode HTML guna memakainya
<div class='dragMove'>
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEie2_H4YVoIih5sQZbf0nTlOB2x6HdHSfeofJ_cRm851KIgsHQYuT5OAd5nwKMVy-XfojutQsGrKHxRLoRow1qOLvonO4IpC1nCoUC8So_HtYBwBKU9J8A_EZQxjwC4hkOKla2N4ulNlY8/++Pearce.jpg' />
</div>

DEMO: Klik buat mengambil link!

Loading...
Loading...