untuk membuat file ini membutuhkan
- Gambar
- jquery bisa kita download atau mengambil dari code.jquery.com
- dll
Baca juga cara membuat barcode dengan php dan jquery
<html><head>
<title>Memutar gambar</title>
<script src="http://code.jquery.com/jquery-2.1.1.js"></script> // import script jquery
<script>
// fungsi putargambar
function putarGambar(degree) {
var angle = degree || 0;
$('#idgambar').css({'transform': 'rotate(' + angle + 'deg)'}); // mengubah css berdasarkan idgambar
$('#idgambar').data('angle', angle + 90); //mengubah angle berdasarkan idgambar
}
</script>
<style>
#demo-image{padding:25px 10px;}
.btnRotate {padding: 5px 10px;background-color: #09F;border: 0;color: #FFF;cursor: pointer;}
</style>
</head>
<body>
<div>
<label>Rotate Image:</label>
<input type="button" value="90" onClick="putarGambar(this.value);" /> // putar 90 derajat
<input type="button" value="-90" onClick="putarGambar(this.value);" /> // putar 240 derajat
<input type="button" value="180" onClick="putarGambar(this.value);" /> // putar 180 derajat
<input type="button" value="360" onClick="putarGambar(this.value);" /> // putar 360 derajat
//button untuk mengubah anggel gambar
</div>
<div><img src="namagambar" id="idgambar" /></div>
</body>
</html>
NB :
- simpan script diatas pada file html/php
- ubah src namagambar menjadi tempat dan nama gambar anda disimpan "image/gambar.jpg"
1 komentar:
komentarmas mau nanya, gimana cara nya ketika gambar diputar tidak kembali lg keawal setelah direfresh?
Reply