Home Pemrograman Web

Cara Membuat Marquee / Tulisan Berjalan di HTML (bervariasi + lengkap dengan contoh)

   Comment   

Pendahuluan

Cara Membuat Marquee (Tulisan Berjalan) Bervariasi dan Lengkap di HTML - Apa marqquee itu??? Marquee adalah tulisan yang dibuat agar dapat berjalan. Marquee berguna agar tampilan website terlihat menarik. Cara membuatnya tidak susah lho. Langsung saja simak tutorial Cara Membuat Marquee (Tulisan Berjalan) Bervariasi dan Lengkap di HTML di bawah!

Syntag / Kode Dasar Membuat Tulisan Berjalan (Marquee) di HTML

Syntag dasar dari marquee atau tulisan berjalan di HTML adalah 
<marquee> Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>
, hasilnya sebagai berikut:
Tutorial cara membuat tulisan berjalan marquee di HTML


Bosen yah... Jika teks berjalan marquee-nya hanya monoton seperti di atas. Nah, agar tidak bosan teks berjalan marquee dapat ditambahkan variasi-variasi seperti di bawah ini :

Cara Membuat Marquee (Tulisan Berjalan) Bervariasi dan Lengkap di HTML


gambar Marquee
gambar. marquee

Cara mengganti warna background pada tulisan berjalan maquee

Cara mengganti warna background pada tulisan berjalan maquee adalah dengan menambahkan ... bgcolor="Kode_warna_html">,
Kode_warna_HTML Silahkan ganti dengan kode warna HTML atau nama warna dalam bahasa Inggris (misal : red, blue, purple, yellow, green, dll) sesuka sobat. Berikut ini contoh penerapannya :
<marquee bgcolor="green">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>

Hasil dari kode marquee di atas adalah :
Tutorial cara membuat tulisan berjalan marquee di HTML

Cara mengatur arah gerakan text atau marquee

Untuk mengatur arah gerakan text/marquee dengan cara menambahkan kode ... direction="left/right/up/down"> ,
silahkan pilih salah satu arah antara left, right, up ataupun down. Berikut contoh penerapannya : 
<marquee direction="down">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>

Hasil syntag atau kode marquee di atas adalah
Tutorial cara membuat tulisan berjalan marquee di HTML

Mengatur perilaku gerakan teks berjalan marquee

Untuk mengatur perilaku gerakan dengan cara menambahkan kode ... behavior="scroll/slide/alternate">

  • Fungsi kode behavior="scroll" pada teks berjalan marquee
    behavior="scroll" berfungi untuk membuat teks berjalan secara berputar. Berikut contoh penerapannya
    <marquee behavior="scroll">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>

    Hasil dari syntag atau kode marquee di atas adalah :
    Tutorial cara membuat tulisan berjalan marquee di HTML


  • Fungsi kode behavior="slide" pada teks berjalan marquee
    behavior="slide" kode untuk membuat teks berjalan marquee berjalan sekali lalu berhenti. Berikut contoh penerapannya :
    <marquee behavior="slide">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>

    Hasil dari syntag atau kode marquee di atas adalah :
    Tutorial cara membuat tulisan berjalan marquee di HTML


  • Fungsi kode behavior="alternate" pada teks berjalan marquee
    behavior="alternate" adalah kode untuk membuat teks berjalan (marquee) bolak-balik ke kanan-ke kiri. Berikut contoh penerapannya :
    <marquee behavior="alternate">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>

    Tutorial cara membuat tulisan berjalan marquee di HTML

Cara memberi pesan/teks saat mouse berada di atas teks marquee

Memberi pesan atau teks saat mouse berada di atas teks marquee dengan cara menambahkan kode title="isi_pesan".
Berikut contoh penerapannya :
<marquee title="i love you">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>
Hasil dari syntag atau kode marquee di atas adalah :

Silahkan letakkan kursor kamu di tulisan ini

Cara mengatur kecepatan gerakan pada teks berjalan / marquee

scrollamount="kecepatan" adalah kode tambahan untuk mengatur kecepatan gerakan teks berjalan / marquee. Berikut contoh penerapannya :
Misalkan saya akan mengisikan scrollamount="4"
<marquee scrollamount="4">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>
Hasil dari syntag atau kode marquee di atas adalah :

Tutorial cara membuat tulisan berjalan marquee di HTML

Cara mengatur waktu tunda gerakan pada teks berjalan / marquee

scrolldelay="jumlah waktu tunda" merupakan kode tambahan untuk mengatur waktu tunda gerakan teks berjalan / marquee dalam mili detik (1 detik = 1000).
Contoh : scrolldelay="250"
<marquee scrolldelay="250">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>
Hasil dari syntag atau kode marquee di atas adalah :

Tutorial cara membuat tulisan berjalan marquee di HTML

Cara mengatur lebar blok teks pada teks marquee

Untuk mengatur lebar blok text dalam persen atau pixel pada teks berjalan / marquee dengan cara menambahkan kode width="angka". Berikut contoh penerapannya :


<marquee width="20">Tutorial cara membuat tulisan berjalan marquee di HTML</marquee>
Hasil dari syntag atau kode marquee di atas adalah :

Tutorial cara membuat tulisan berjalan marquee di HTML

Penutup

Mungkin itu saja mengenai Cara Membuat Marquee / Tulisan Berjalan di HTML (bervariasi + lengkap dengan contoh). Jika kalian memiliki variasi lain yang dapat ditambahkan pada teks berjalan atau marquee silahkan tulis kode kalian di kolom komentar. Selamat mencoba!

Buku Pembelajaran Kelas X : Pemrograman Web smt 1

   Comment   

Materi Lengkap Tentang Array

   Comment   

Array


Pengertian Array

  1. Array adalah Kumpulan data bertipe sama yang menggunakan nama sama.
  2. Array adalah tipe data yang memiliki kemampuan dapat mengumpulkan beberapa data yang bertipe sama dalam satu variable sehingga dalam pembuatan terdiri dari beberapa tipe yang sama tidak membutuhkan banyak variable.
  3. Array dalam ilmu komputer, adalah suatu tipe data terstruktur yang dapat menyimpan banyak data dengan suatu nama yang sama dan menempati tempat di memori yang berurutan serta bertipe data sama pula.
  4. Array adalah tipe data terstruktur yang terdiri dari sejumlah komponen-komponen yang mempunyai tipe sama.

Array 1 dimensi

Array 1 Dimensi adalah Elemen-elemen array dapat diakses oleh program menggunakan suatu indeks tertentu. Pengaksesan elemen array dapat dilakukan berurutan atau random berdasarkan indeks tertentu secara langsung. Pengisian dan pengambilan nilai pada indeks tertentu dapat dilakukan dengan mengeset nilai atau menampilkan nilai pada indeks yang dimaksud.
<?php
$data_array = array (
'buah' => array ('pisang','nanas','pepaya','apel','mangga'),
'mobil' => array('innova','jazz','fortuner','ferrary')
);
echo '<pre>';
print_r($data_array);
echo '</pre>';
?>

Array 2 dimensi

Array dua dimensi adalah array yang membutuhkan dua index dalam mengakses elemen-elemennya. Index dalam array dua dimensi diwakili oleh baris (row) dan kolom (column) seperti yang ditunjukkan oleh dibawah ini :
Ini Adalah Contoh Programnya
<?php

//Membuat array dua dimensi
$nilai=array(
array(90,65,83),
array(90,78,87),
array(78,90,78)
);

//Akses elemen array 2 dimensi secara manual
echo "<strong>nilai array ditampilkan secara manual:</strong><br>";
echo $nilai[0][0]." ".$nilai[0][1]." ".$nilai[0][2]."<br>";
echo $nilai[1][0]." ".$nilai[1][1]." ".$nilai[1][2]."<br>";
echo $nilai[2][0]." ".$nilai[2][1]." ".$nilai[2][2]."<br><br>";

//Akses elemen array dengan menggunakan looping
echo "<b>Nilai array ditampilkan dengan looping bersarang :</b><br>";
for($baris=0;$baris<count($nilai);$baris++)
{
for($kolom=0;$kolom<count($nilai[$baris]);$kolom++)
{
echo $nilai[$baris][$kolom]." ";
}
echo "<br>";
}

?>

3.Array Multidimensi

Array multidimensi adalah array yang mengandung satu atau beberapa array lain didalamnya atau bisa dikatakan array dalam array. Sehingga kita dapat membuat array dimensi dua maupun array dimensi tiga.
Array bisa memilki kedalaman yang tidak terbatas, yang sering disebut array multidimensi, bisa dua dimensi, tiga, dst… Multidimensi disini dapat diibaratkan array didalam array, maksudnya value dari suatu array menjadi index dari array yang lain, sehingga value ini bentuknya juga array, contoh:
Kita terjemahkan array multidimensi seperti contoh sebelumnya:
$kendaraan = [
['Mobil' => ['merk' => 'Toyota', 'type' => 'Vios', 'year' => '2016']], // value mobil menjadi index
'Sepeda',
'Truk',
['Motor' => ['Honda', 'Yamaha', 'Suzuki']], // value motor menjadi index
'Bus'
];
echo '<pre>'; print_r($kendaraan);

/* HASIL:
Array
(
[0] => Array
(
[Mobil] => Array
(
[merk] => Toyota
[type] => Vios
[year] => 2016


) )

[1] => Sepeda
[2] => Truk
[3] => Array
(
[Motor] => Array
(
[0] => Honda
[1] => Yamaha
[2] => Suzuki
)

)

[4] => Bus
)
*/