DP BBM 23 - Cara Membuat Roulette Sederhana dengan Menggunakan PhotoShop - selamat siang dan selamat berjumpa kembali sahabat blog DP BBM 23 semuanya .. setelah beberapa hari yang lalu membahas dan berbagi mengenai Cara Membuat DP BBM Animasi Dengan Efek Mata Berkedip Dengan Menggunakan PhotoShop di kesempatan ini admin kembali untuk berbagi tutor sederhana yang mungkin sedikit bisa membantu / berguna / bermanfaat .. tapi sebelumnya mohon untuk dimaklum saja bila banyak salah - salah kata dalam penyampaian .. karena saya tidak pandai membuat tutorial .. hanya saja cuma sekedar mengisi kekosongan di blog ini .. walau tak sesuai dengan nama blog tetapi tidak apa - apalah jadi blog gado - gado juga .. gado - gado juga enak toh di makan hehe ..

ok next .. sebelumnya tau kan apa itu roulette ?? sobat sebagai user cashtree ( cashtrian sebutan bagi user / pengguna cashtree ) tentunya tau donk .. itu tuh yang di dalam aplikasi cashtree di namakan stamp .. yang dimana bagi usernya di perbolehkan memutar roulette di hari ke 2 dan hari ke 5 untuk mendapatkan cash yang beragam .. dari mulai 50 rupiah hingga 1 juta rupiah bagi yang beruntung .. jika penasaran silahkan sobat download aja aplikasi cashtree nya .. coba mainkan roulette nya dan dapatkan hadiah cash nya untuk di tukar dengan pulsa gratis all operator .. Download Cashtree .. silahkan sobat klik saja .. nanti dibawa ke playstore .. tinggal sobat download saja .. gratis kok ..

next .. disini saya gk akan membahas soal aplikasi cashtree .. melainkan berbagi dan membahas bagaimana caranya membuat roulette seperti yang ada di dalam aplikasi cashtree maupun di dalam permainan - permainan yang mengaruskan user nya memutar roulette untuk mendapatkan poin atau bonus tambahan .. nah untuk itu saya akan bahas cara pembuatan nya yang sangat sederhana banget dengan menggunakan photoshop dan cara memasangnya di situs / blog / website dengan mengunakan 3 jenis kode .. yaitu HTML / CSS / JS ( Java Script )..

ok .. tanpa banyak basa - basi lagi .. langsung saja ke tahap awal .. yaitu cara pembuatan gambar roulette nya dulu .. setelah nanti gambar sudah jadi dibuat tinggal coba di pasang di website game milik sobat atau terserah mau sobat pasang di mana .. karena disini saya cuma membuat contoh nya saja .. dan biar gk banyak cakap lagi .. lihat saja gambar - gambar dibawah ini








nah, itulah cara sederhana membuat gambar roullete yang dapat saya buat dan bagikan untuk sobat semuanya .. lalu sekarang ke tahap 2 .. yaitu cara untuk membuat roulette tersebut dapat berputar .. untuk caranya silahkan sobat copas saja semua kode HTML / CSS / JS ( Java Script ) di bawah ini ..

<div class="container">
<div class="roulette">
</div>
<button class="spinner">
<span>Start</span>
<div class="pointer"></div>
</button>
</div>
<style type="text/css">
.container {
position: absolute;
left: 20%;
top:10%;
}

.resultados-contenedor{
font-family:verdana;
}

.roulette {
position: absolute;
margin: 0 auto;
width: 300px;
height: 300px;
left: 40%;
background-color: #0a9e01;
background-size: 300px 300px;
background-image: url('url gambar roulette png');
border-radius: 300px;
}

.spinner {
cursor: pointer;
color: #ffffff;
font-weight: bold;
border: none;
position: absolute;
width: 100px;
height: 100px;
top: 100px;
left: 100px;
border-radius: 100%;
z-index: 1000;
background-color: #0a9e01;
}

.spinner .pointer {
position: absolute;
width: 0;
height: 0;
top: -50px;
left: 40px;

border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-bottom: 60px solid #0a9e01;
}
</style>
<script type="text/javascript">
var options = {
prices: [
{
name: 'DB23'
},
{
name: 'Ocha'
},
{
name: 'Love'
},
{
name: 'Sedih'
},
{
name: 'Galau'
},
{
name: '$5'
},
{
name: '$10'
},
{
name: '$15'
}
],
duration: 7
};
var $r = $('.roulette').fortune(12);

var clickHandler = function() {
$('.spinner').off('click');
$('.spinner span').hide();
$r.spin().done(function(price) {
$('.resultado').html(price);
$('.spinner').on('click', clickHandler);
$('.spinner span').show();
});
};

$('.spinner').on('click', clickHandler);
</script>


Note : di dalam tab CSS ada tulisan background-image: url('url gambar roulette png'); ganti yang warna biru dengan url / link gambar roulette yang sudah sobat buat .. dengan format PNG

cara ini saya menggunakan dengan spinner dan untuk hasilnyaa silahkan sobat tes / coba dengan mengklik tulisan Start yang berada ditengah - tengah roulette dibawah ini ..


gimana ?? mudah bukan ?? ternyata sangat mudah ya membuat roulette itu .. tapi jika sobat ingin membuatnya untuk di masukan kedalam aplikasi yang sobat buat maupun untuk di pasang pada website khusus game .. tentunya tidak hanya dengan menggunakan kode yang saya share di atas .. tapi sobat juga tau sendirilah .. jika gk tau cari aja di google hehehe ..

Cara Membuat DP BBM Animasi Dengan Efek Mata Berkedip Dengan Menggunakan PhotoShop
DP BBM 23 - Cara Membuat DP BBM Animasi Dengan Efek Mata Berkedip Dengan Menggunakan PhotoShop - selamat malam dan selamat berjumpa lagi sahabat DP BBM 23 semuanya .. setelah beberapa hari lalu membahas dan berbagi mengenai Kata Kata Bad Mood Bete Gk Semangat Buat Setatus Facebook dan BBM Terbaru 22 April 2017 dikes...View More

ok next .. itulah tadi seputar Cara Membuat Roulette Sederhana dengan Menggunakan PhotoShop yang dapat admin blog DP BBM 23 bagikan .. semoga dapat membantu dan terinspirasi untuk membuat roulette seperti yang sobat inginkan dan terimakasih bagi sobat yang sudah meluangkan waktunya .. untuk membaca dari awal sampai akhir .. selamat siang dan sampai jumpa ..
 
Top
'