tRikSonic

HTML canvas Tag

Terakhir diperbarui : 28 Mei 2018 - 23.53
HTML canvas Tag - belajar html canvas , element <canvas> mempunyai definisi sebagai kanvas. element <canvas> digunakan untuk membuat grafik atau bitmap, baik berupa teks , gambar, maupun konten 2 dimensi. Dalam penerapan pada html, element <canvas> hanya berfungsi sebagai tempat atau media, sedangkan hasil yang ditampilkan dieksekusi oleh javascript . Contoh 1 html element <canvas> : < canvas id = "canvas" width = "250" height = "100" > Maaf browser anda tidak support element canvas </ canvas > < script > var canvas= document .getElementById( "canvas" ); var canvasku=canvas.getContext( "2d" ); canvasku.font= "30px Arial" ; canvasku.fillStyle= "red" ; var txt= "Trik Sonic" canvasku.fillText(txt, 10 , 50 ); </ script > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo ...
Baca selengkapnya

HTML area Tag - Tutorial HTML

Terakhir diperbarui : 23 Mei 2018 - 15.47
Tutorial HTML <area> HTML area Tag - belajar html area. Element area mendefinisikan sebagai area yang berada di dalam gambar ( peta gambar ), dan dapat diklik oleh user dengan setting koordinat yang telah ditentukan. Dalam penulisan pada html, html <area> harus di bungkus oleh html <map> , html <area> akan terintegrasi dengan html <img> yang disertai dengan atribut usemap Atribut HTML <area> Atribut Nilai Penjelasan alt teks Menunjukkan sebuah alternate text pada area. coords koordinat Menentukkan koordinat pada area download nama file Menunjukkan bahwa target akan didownload ketika diklik href url/link Menentukkan URL / Link. hreflang kode bahasa Menentukkan bahasa yang digunakan pada target. media media query Menentukkan media query yang digunakan pada dokumen pada url, yang berada pada area yang ditentukan. rel alternate author bookmark help license next nofollow noreferrer prefetch prev search tag Menentukan hubungan an...
Baca selengkapnya

Fungsi jQuery toggle (), Belajar jQuery

Terakhir diperbarui : 23 Mei 2018 - 15.53
Tutorial jquery toggle() jquery toggle() digunakan untuk menyembunyikan dan menampilkan element (1 perintah yang mempunyai 2 fungsi) .hide() dan .show() dengan metode interaktif yang dilakukan oleh user, baik itu dengan metode klik fungsi, mouse fungsi, tombol fungsi pada komputer. Syntax: $( selector ).toggle(speed,callback); Contoh penerapan jquery toggle() Contoh 1 : $( function ( ) { $( "button" ).click( function ( ) { $( "#demo" ).toggle(); }); }); <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> <style> .box { background: #ffbccb; padding: 15px; border: 1px solid gainsboro; border-radius: 4px; margin: 10px 0px; } </style> </head> <body> <button>Toggle DIV</button> <div class="box" id='demo'>Tekan tombol diatas</div> <script src="https://ajax.googleapis.com/a...
Baca selengkapnya

Fungsi jQuery hide (), Belajar jQuery

Terakhir diperbarui : 23 Mei 2018 - 15.56
Tutorial jquery hide() Fungsi hide() pada jQuery - jquery hide() digunakan untuk menyembunyikan atau menghilangkan element yang terlihat pada browser dengan metode interaktif yang dilakukan oleh user, baik itu dengan metode klik fungsi, mouse fungsi, tombol fungsi pada komputer dll. Syntax: $( selector ) .hide ( speed , callback ); Contoh penerapan jquery hide() Contoh 1 : $( function ( ) { $( ".hide" ).click( function ( ) { $( "#demo" ).hide(); }); }); <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> <style> #demo { background: #ffbccb; padding: 15px; border: 1px solid gainsboro; border-radius: 4px; margin: 10px 0px; } </style> </head> <body> <button class="hide">hide</button> <div id="demo"> Tekan tombol Run untuk menyegarkan editor </div> <script src="https://a...
Baca selengkapnya

Fungsi jQuery show (), Belajar jquery

Terakhir diperbarui : 23 Mei 2018 - 15.59
Tutorial jquery show() Fungsi show() pada jQuery - jquery show() digunakan untuk menampilkan element yang tersembunyi dengan metode interaktif yang dilakukan oleh user, baik itu dengan metode klik fungsi, mouse fungsi, tombol fungsi pada komputer dll. Syntax: $( selector ) .show ( speed , callback ); Contoh penerapan jquery show() Contoh 1 : $( function ( ) { $( ".show" ).click( function ( ) { $( "#demo" ).show(); }); }); <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> <style> #demo { background: #ffbccb; padding: 15px; border: 1px solid gainsboro; border-radius: 4px; margin: 10px 0px; } </style> </head> <body> <button class="show">show</button> <div id='demo' style="display:none;"> Tekan tombol Run untuk menyegarkan editor </div> <script src="https://aja...
Baca selengkapnya

HTML ul Tag

Terakhir diperbarui : 23 Mei 2018 - 16.12
Tutorial HTML <ul> HTML ul Tag - belajar html <ul> . HTML ul mempunyai definisi sebagai daftar bullet / berbutir / berpoint . Dalam penulisan pada html, element ini biasanya diikutsertakan element <li> sebagai element pembuat daftar. Element <ul> didalam html, bisa ditulis secara berulang atau bercabang tanpa ada batasan jumlah penulisan, asal setiap panambahan element <ul> didalam element <ul> itu sendiri, selalu ditutup dengan tag penutup html yang benar. Contoh HTML <ul> < ul > < li > Daftar List 1 </ li > < li > Daftar List 2 </ li > < li > Daftar List 3 </ li > < li > Daftar List 4 </ li > < li > Daftar List 5 </ li > </ ul > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <ul> <li>Daftar List 1</li> <l...
Baca selengkapnya

HTML li Tag

Terakhir diperbarui : 23 Mei 2018 - 16.23
Tutorial HTML <li> : HTML li Tag - belajar html li. Element li mempunyai definisi sebagai daftar list berupa item, Dalam penulisan pada html, element <li> ditulis di dalam rentang element <ol> , <li> dan <menu> . Element <li> akan menyesuaikan fungsinya dengan element yang membungkusnya. misal : jika yang membungkusnya element <ol> , maka akan menghasilkan tampilan daftar list berupa angka ( numbered list ), jika yang membungkusnya element <ul> , maka akan menghasilkan tampilan daftar list berupa bulatan titik ( bullet list ). Contoh HTML <li> : < ul > < li > Mawar </ li > < li > melati </ li > < li > Anggrek </ li > </ ul > < ol > < li > Mawar </ li > < li > melati </ li > < li > Anggrek </ li > </ ol > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title...
Baca selengkapnya

HTML legend Tag

Terakhir diperbarui : 23 Mei 2018 - 16.31
Tutorial HTML <legend> : HTML legend Tag - belajar html legend, element legend mempunyai definisi sebagai keterangan atau sebagai judul dari element <fieldset> . Didalam penulisan html element <legend> ditulis setelah tag pembuka element <fieldset> . Contoh HTML <legend> < form > < fieldset > < legend > KOMENTAR </ legend > < textarea placeholder = "masukan komentar kamu disini..." > </ textarea > </ fieldset > </ form > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> <style> textarea { width : 100%; height : 150px; resize : none; background : beige; } </style> </head> <body> <form> <fieldset> <legend>KOMENTAR</legend> <textarea placeholder="masukan komentar kamu disini..."></textarea> </fieldset> <...
Baca selengkapnya

HTML label Tag

Terakhir diperbarui : 23 Mei 2018 - 16.39
Tutorial HTML <label> : HTML label Tag - belajar html label, element label mempunyai fungsi sebagai label atau identitas pada element yang terkait dengan form field, contoh nya : <form> , <input> dan lain sebagainya. Contoh HTML <label> < label > < input type = "text" /> </ label > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <label> <input type="text"/> </label> </body> </html> Uji coba Attribute HTML <label> for Mengikat penggunakan label berdasarkan ID tertentu Contoh : < form > < label for = "nama-lengkap" > Nama Lengkap : </ label > < input type = "text" id = "nama-lengkap" /> < br > < label for = "alamat-lengkap" > Alamat Lengkap : </ label > ...
Baca selengkapnya

HTML kbd Tag

Terakhir diperbarui : 23 Mei 2018 - 16.52
Tutorial HTML <kbd> HTML kbd Tag - belajar html kbd , element kbd adalah salah satu dari tag phrase atau frase , elemen ini mendefinisikan input keyboard . Contoh Tag Phrase adalah sebagai berikut <em> <code> <kbd> <samp> <strong> <var> Contoh penerapan html <kbd> < p > < kbd > Ctrl </ kbd > + < kbd > Alt </ kbd > + < kbd > Delete </ kbd > . </ p > <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <title>Demo Triksonic</title> </head> <body> <p> <kbd>Ctrl</kbd> + <kbd>Alt</kbd> + <kbd>Delete</kbd>. </p> </body> </html> Uji coba Global Attributes: Element <kbd> mencakup Global Attributes HTML . Event Attributes: Element <kbd> mencakup Event Attributes HTML . Browser Support : Desktop Chrome Ya Sa...
Baca selengkapnya