Episode sebelumnya Beben Koben si bloglang anu ganteng kalem tea sudah memaparkan mengenai
HTML editor online opensource, yang mana arti dari
opensource itu sendiri disana kita dapat mendownloadnya secara gratis. Sekarang Koben akan berbagi source Editor HTML yang dapat digunakan secara offline kepada kalian :) (supaya rajin belajar bahasa HTML) Adapun tata cara pemakaian sobat dapat membacanya pada postingan
tata cara memakai editor HTML. Sama tapi berbeda dengan pendahulunya
Live HTML Editor, kreasi kali ini gue menambahkan
tools generated encode ke dalamnya.
Sebelum mendownloadnya, harap sobat mau memperhatikan sebentar sedikit keterangan dari screenshot editor-html kreasi si bloglang anu ganteng kalem tea ini ya ;)) :">
Keterangan lambang/angka pada gambar!
* Link postingan keterangan tata cara pakai kalau sobat pada lupa :D
1 Tempat meletakkan code/script yang sudah dirancang oleh kalian masing². Disana Koben telah masukan contoh penerapan bermain dengan tag CSS. Pencet tombol LIHAT, maka hasil akan muncul pada kotak yg diberi nomor 2 pd screenshot. Untuk menghilangkannya tekan saja tombol Clear :D
3 Sorot pada tulisan Color Viewer sampai keluar tabel warna kecil imut², pilih warna dengan cursor sj tanpa hrs diklik, maka kode warna secara otomatis akan terlihat pada kotak yg bertuliskan Hexa Value (sebelah kirinya).
4 Tools convert warna juga, namun sobat bisa tulis kode warna apa saja disana, maka nanti hasilnya akan terlihat pada background yg berganti warna sesuai dengan code color yg kalian tulis tadi ;) Sok coba saja tulis kode warna apa saja, mau yg angka, mau yg abjad, yg penting harus berjumlah 3 atau 6 konten! Ex 3 content: AAA, F60, EFG,... Ex 6 content: AAAAAA, FF00FF, FFFF00,...
5 Sudah pada tahu mungkin semua untuk apa yg satu ini, yes buat menampilkan penulisan code/script agar tampil maknyus saat postingan di publish :) Kalau tidak dilakukan convert terlebih dahulu, maka script/coded yg akan diposting tidak akan nongol :))
6 Hasil convert, yg mana mengambilnya nanti kalian hanya tinggal klik saja ;)
Tools ini beroperasi secara offline sob. Tapi ketika kita mau mempraktekan trik dan memang membutuhkan harus online, bisa juga dipakai. Contoh kasus online ketika mau berpraktek ria dengan JavaScript!!! Tekan tombol Clear terlebih dahulu, masukin coba form JavaScript berikut pada kotak sebelah kanan point 1 pd screenshot, diikuti dengan menekan tombol Lihat. Apa yg terjadi!!!
<script type="text/javascript">
var imgArr = new Array("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVAWIFkXRzPL-ah1wwOmCdLYz4LR-H06LPFNI0ZFXoWGCzykKeTGre0vpdIQGJNJaXG5uI5FSoa4sskZHfllhvMCy10GpqXOapQxrAjcHECzpOsochhFqEdaO8QDewZ6PQxE1YHU5ZmuM/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjXFTQZZ8u3lPAagHbDFAWchveqUOq-wzW7CQ2tv5u-bel0LSWHmm23iVh0n9nbshpU4XYNaqqOJ8OrSNWCSUai0UsNKYEwFeIU_eMUuqMT_ZMhyVa-weIqbVbi0skELxgjQk2CkgdG0HE/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2NC-tcoYSe_EdOAC5MvA3FUaR0l8a-6hlbngeiFsm10GgR8xAlSr80oV_dLYyikHnUZD9fEHuqa5bQGvhdpNJ1kwaB5uBuExMgr55kZwD6lgWLEvdlexf2NyuqJ1IIkCOXlBA_dv3z3E/");
var count = imgArr.length;
var position = 0;
function slidingImages() {
if ( document.images ) {
if ( position < count ) {
imageSrc(position);
position += 1;
} else {
position = 0;
imageSrc(position);
}
}
setTimeout(slidingImages, 3000);
}
function imageSrc(position) {
document.banner.src = imgArr[position];
}
</script>
<body onload="slidingImages()">
<img style='width:100%' src='' name='banner'/>
Benar sekali sobatku sekalian, itu merupakan form JavaScript slider minimalis sekali b-) Begitulah jika mau bermain dengan script. Tak beda dengan dengan jQuery juga, yg terpenting kita ada script intinya ;) Makanya harus online saya bilang jg, wong ada hostingan image, script jQuery kalo memang mau bermain dengan itu dll ;)) Ekpslore saja lah, lama-lama jg akan paham. Sikaaattt link downloadnya brooo
Mau lagi tools offline lainnya??? Cari saja sendiri, yg sudah opensource :)) Semoga bermanfaat :)
Happy html editor \m/
editor post blogger
