Cara Membuat Chips Card dengan Framework Materialize.css
Hallo teman teman balik lagi dengan saya Ismet Maulana kali ini saya ingin berbagi pengetahuan mengenai Bagaimana CARA MEMBUAT CHIPS CARD Dengan Framework Materialize.css teman teman pernah mengirim email dengan gmail, pasti ketika kita masukkan nama email yang kita ingin tuju dengan otomatis nama email tersebut akan keblog, nah itu yang saya ingin ajarkan di sini .
Caranya lumayan gampang, teman-teman dapat copy script di bawah ini yah :
<head>
<link href=http://fonts.googleapis.com/icon?family=Material+Icons rel=stylesheet>
<link type=text/css rel=stylesheet href=css/materialize.min.css media=screen,projection/>
<script type=text/javascript src=https://code.jquery.com/jquery-2.1.1.min.js></script>
<script type=text/javascript src=js/materialize.min.js></script>
<meta name=viewport content=width=device-width, initial-scale=1.0/>
</head>
<body>
<div class=chips chips-placeholder></div>
</body>
javascript :
<script>
$('.chips').material_chip();
$('.chips-initial').material_chip({
data: [{
tag: 'Apple',
}, {
tag: 'Microsoft',
}, {
tag: 'Google',
}],
});
$('.chips-placeholder').material_chip({
placeholder: 'Enter a tag',
secondaryPlaceholder: '+Tag',
});
var chip = {
tag: 'chip content',
image: '', //optional
id: 1, //optional
};
</script>
bila telah di salin jangan lupa disave yah kemudian jalankan di browser lihat tampilannya .
Lumayan gampang bukan?kita telah selesai menyelesaikan mengenai Bagaimana CARA MEMBUAT CHIPS CARD Dengan Framework Materialize.css, hingga jumpa di artikel berikutnya yah ..
Selamat mencoba..
#KeepLearn
#IsmetMA
Sumber https://kursuswebsite.org
