tes online

SOAL ULANGAN PRAKTEK KELAS 8 PLUS!

Buatlah efek teks berjalan (marquee effects) yang di didalamnya terdapat link dari halaman web SMPN 1 Boyolangu, dengan ketentuan:

-ketika mouse berada di atasnya teks akan berhenti dan muncul pesan “website SMPN 1 Boyolangu”

-teks bergerak kiri kanan (bolak-balik)

-kecepatan gerakan 5 pixel

-lebar 75%, tinggi 75

contoh kode html untuk membuat teks website menjadi link:

<a href="http://smpn1boyolangu.sch.id" target="new">Website Siboy</a><br/>

Soal Ujian Tulis Kelas 8

PILIHLAH SATU JAWABAN YANG BENAR!

1.     Berikut ini tag yang benar untuk efek teks berjalan (marquee)…

a. </marquee atribut>...<marquee>               c. <marquee atribut>...<marquee>

b. </marquee atribut>...</marquee>             d. <marquee atribut>...</marquee>

2.     Berikut ini yang merupakan atribut dalam efek marquee, yang benar adalah..

a. a href                                    c. bgcolor

b. colour                                    d. bgcolour

3.     Untuk membuat efek arah gerakan ke kanan digunakan script/atribut..

a. direction=”top”           c. direction=”toward”

b. direction=”up”            d. direction=”right”

4.     Untuk membuat efek arah gerakan ke atas digunakan script/atribut..

a. direction=”top”           c. direction=”toward”

b. direction=”up”            d. direction=”vertical”

5.     Script/Atribut yang digunakan untuk mengatur perilaku gerakan teks bergerak dari kiri ke kanan dan balik lagi (bolak-balik) adalah…

a. BEHAVIOR="scroll "             c. BEHAVIOR="alternate"

b. BEHAVIOR="slide "              d. BEHAVIOR="rotate"

6.     Atribut Scrollamount=”angka” berfungsi untuk…

a. mengatur kecepatan gerakan dalam cm/dtk, semakin besar angka semajin cepat gerakannya

b. mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin cepat gerakannya

c. mengatur waktu tunda gerakan dalam pixel, semakin besar angka semajin lambat gerakannya

d. mengatur kecepatan gerakan dalam pixel, semakin besar angka semajin lambat gerakannya

7.     Atribut scrolldelay=”angka” berfungsi untuk…

a. Untuk mengatur waktu tunda gerakan dalam mili detik

b. Untuk mengatur waktu tunda gerakan dalam meter detik

c. Untuk kecepatan waktu gerakan dalam mili detik

d. Untuk mengatur waktu tunda gerakan dalam pixel

8.     Script/Atribut yang digunakan untuk mengatur perilaku gerakan teks bergerak berputar adalah…

a. BEHAVIOR="scroll "             c. BEHAVIOR="alternate"

b. BEHAVIOR="slide "              d. BEHAVIOR="rotate"

9.     Agar pesan muncul saat mouse berada di atas teks digunakan atribut…

a. show=”pesan”                       c. title=”pesan”

b. appears=”pesan”                  d. blink=”pesan”

10. <marquee align="center" direction="right" height="200" scrollamount="2" width="30%">teks</marquee>

Script Marquee digunakan untuk menghasilkan efek…

a. teks bergerak ke tengah dengan kecepatan 2 pixel, tinggi blok teks 200cm dan lebar 30%

b. teks bergerak ke kanan dengan kecepatan 2 pixel, tinggi blok teks 200 pixel dan lebar 30%

c. teks bergerak ke kanan dengan kecepatan 200 pixel, tinggi blok teks 2 pixel dan lebar 30mm

d. teks bergerak ke kiri dengan kecepatan 2 pixel, tinggi blok teks 200 pixel dan lebar 30%

11. Berikut adalah kode yang benar untuk mengatur arah gerakan teks ke kanan dengan kecepatan gerakan teks sebesar 5 pixel …

a. <MARQUEE direction="right" scrollamount="5">teks anda</MARQUEE>

b. <MARQUEE>direction="left" scrollamount="5"<teks anda></MARQUEE>

c. </MARQUEE direction="left" scrollamount="5">teks anda</MARQUEE>

d. </MARQUEE direction="right" scrolldelay="5"><teks anda></MARQUEE>

12. Script HTML yang digunakan untuk membuat teks bergerak kiri-kanan (bolak-balik) dengan teks tebal berwarna kuning & background abu-abu adalah…

a. <font “style=color:yellow”><marquee bgcolor=”grey” behavior=”slide”>Teks Anda</marquee></font>

b. <font style=color:”yellow”><marquee bgcolor=grey direction=”alternate”>Teks Anda</marquee></font>

c. <font style=”color:yellow”><marquee bgcolor=”grey” behavior=”alternate”>Teks Anda</marquee></font>

d. <font style=”color:yellow”><marquee bgcolor=grey behavior=”scroll”>Teks Anda</marquee></font>

13. Berikut adalah kode html untuk penulisan teks dengan variasi huruf dan warna belakang dengan penulisan yang benar yaitu…

a. <div align="left"><font face="times new roman" color="white"><b><marquee bgcolor="red" width="70%" scrollamount="3" behavior="alternate">Teks Anda</marquee></b></div></font>

b. <div align="left"><font face="times_new_roman" color="white"><b><marquee bgcolour="red" width="70%" scrollamount="3" behavior="alternate">Teks Anda</marquee></b></div></font>

c. <div align="left"><font face="arial" colour="green"><b><marquee bgcolour="red" width="70%" scrollamount="3" behavior="alternate">Teks Anda</marquee></b></div></font>

d. <div align="left"><font face="arial" color="white"><b><marquee bgcolor="red" width="70%" scrollamount="3" behavior="alternate">Teks Anda</marquee></b></div></font>

14. <font face="arial" size="5" style="color: red"><marquee align="center" direction="right" scrollamount="3" behavior="alternate" style="background-color: black" width="100%" height="30">TEKS BERGERAK</marquee></font>

Script HTML di atas bisa diartikan dengan…

a. teks bergerak dari kiri ke kanan lalu balik lagi ( bolak-balik), jenis huruf arial berwarna hitam dan latar belakang teks berwarna merah

b. teks bergerak dari kiri ke kanan, jenis huruf arial berwarna merah dan latar belakang teks berwarna hitam

c. teks bergerak dari kiri kekanan lalu balik lagi ( bolak-balik), jenis huruf arial berwarna merah dan latar belakang teks berwarna hitam

d. teks bergerak berputar, jenis huruf arial berwarna merah dan latar belakang teks berwarna hitam

15. Penulisan kode yang benar agar marquee teks berhenti ketika mouse berada di atas teks…

a. <marquee onmouseover="this.start()" onmouseout="this.stop()" scrollamount="2" direction="down" width="50%" height="200" align="center">Teks Anda</marquee>

b. <marquee onmouseover="this.stop()" onmouseout="this.stop()" scrollamount="2" direction="down" width="50%" height="200" align="center">Teks Anda</marquee>

c. <marquee onmouseover="this.start()" onmouseout="this.start()" scrollamount="2" direction="down" width="50%" height="200" align="center">Teks Anda</marquee>

d. <marquee onmouseover="this.stop()" onmouseout="this.start()" scrollamount="2" direction="down" width="50%" height="200" align="center">Teks Anda</marquee>

Materi Lanjutan Membuat Teks Berjalan atau Marquee

Klik disini untuk materi lanjutan mengenai membuat efek teks berjalan (marquee effect)

Membuat Teks Berjalan (Marquee) Di Side Bar

Download materinya :
di sini
atau 
di sini


atau klik gambar berikut:

Kalo sudah berhasil bikin teks berjalan di sidebar kembangkan sendiri yaa, bikin postingan seperti saya, temanya lingkungan, OK!
contohnya seperti: kegiatan penghijauan, pengelolaan sampah/limbah, konservasi air, perlindungan satwa, perubahan iklim, siaga dan tanggap bencana dll..

membuat link bergambar

materi bisa di download disini

Membuat Link Berjudul

Mungkin kamu bingung, ko judul bahasan topik ini judulnya Link berjudul? Untuk memperjelas bahasan ini, silahkan kamu arahkan mouse tulisan Website Siboy dibawah ini, coba diamkan sebentar pada link tersebut, maka tidak lama kemudian akan muncul tulisan Mau Tau Info Tentang Siboy klik disisni . Nah sekarang mungkin kamu sudah mengerti maksud saya, jadi dalam sebuah link ada kata-kata untuk menekankan ajakan anda kepada para pembaca untuk mengklik link tersebut. Untuk membuat judul link ini sangat mudah, yakni anda hanya harus menambahkan title=" ... " pada link yang kamu buat. 

Contoh link berjudul Website Siboy



Berikut contoh script yang harus ditambahkan untuk membuat link berjudul:
<a href="http://www.smpn1boyolangu.sch.id/" target="new" title="Mau tau info tentang Siboy klik disini">Website Siboy</a>

Memasang Google Translate pada Blog

Fungsi dari gadget google translate ini adalah untuk menterjemahkan bahasa blog kamu dengan berbagai bahasa yang ada di dunia. Karena pengunjung blog/website tidak hanya dari lokal saja tapi berasal dari berbagai negara, jika kamu memasang gadget translate di blog kamu maka akan memudahkan pengunjung dari negara lain mengerti akan isi dari blog kamu.

Berikut panduan lengkap cara memasang Google Translate pada Blog, klik pada gambar dibawah ini

Membuat atau menambahkan gadget daftar link

• Login Blogger.com
• Lakukan tambah langkah Gadget dengan cara yang telah anda ketahui
• Tambah gadget dengan nama : "daftar Link/Link list"
• isikan bagaian judul : misal nya "Blog sahabat"
• url situs baru: isi dengan alamat web-nya misalnya "www.cahsiboy.blogspot.com
• simpan dan lihat hasilnya.

Tugas!
Buat daftar link alamat blog teman minimal sebanyak 10 alamat!

Link dengan window baru

Agar pengunjung blog tidak meninggalkan blog kita karena muncul tampilan baru sesaat setelah mengklik link yang kita sediakan. Maka, bisa disiasati dengan cara membuat window baru, ketika pengunjung mengklik salah satu link tersebut. Hasilnya halaman blog tetap ada dan halaman yang baru di klik akan muncul terpisah pada jendela atau tab yang baru. Untuk membuat link seperti ini dapat di lakukan dengan cara :

• Edit entri yang baru saja anda buat di atas.
• Dari mode Compose ubah ke mode Edit HTML pada halaman edit entri 
• Pada tulisan yang kita buat link tadi akan muncul kode seperti ini (contoh: tulisan "sekolahku" sebagai link di http://www.smpn1boyolangu.sch.id)

<a href="http://www.smpn1boyolangu.sch.id ">sekolahku</a> 

• Maka disini anda harus menambahkan embel-embel kode HTML target="new' ataupun target="_blank" pada awal ataupun akhir kode tersebut. Contoh kode yang sudah di modifikasi adalah : 

<a href="http://www.smpn1boyolangu.sch.id " target="new">sekolahku</a> 

atau bisa juga seperti ini : 

<a href="http://www.smpn1boyolangu.sch.id" target="_blank">sekolahku</a> 

• Lanjutkan mengedit link berikutnya dengan cara yang sama.
• Selesai klik Publish & lihat perubahannya saat anda klik link tersebut.

Link dengan window baru

Agar pengunjung blog tidak meninggalkan blog kita karena muncul tampilan baru sesaat setelah mengklik link yang kita sediakan. Maka, bisa disiasati dengan cara membuat window baru, ketika pengunjung mengklik salah satu link tersebut. Hasilnya halaman blog tetap ada dan halaman yang baru di klik akan muncul terpisah pada jendela atau tab yang baru. Untuk membuat link seperti ini dapat di lakukan dengan cara :

• Edit entri yang baru saja anda buat di atas.
• Dari mode Compose ubah ke mode Edit HTML pada halaman edit entri 
• Pada tulisan yang kita buat link tadi akan muncul kode seperti ini (contoh: tulisan "sekolahku" sebagai link di http://www.smpn1boyolangu.sch.id)

<a href="http://www.smpn1boyolangu.sch.id ">sekolahku</a> 

• Maka disini anda harus menambahkan embel-embel kode HTML target="new' ataupun target="_blank" pada awal ataupun akhir kode tersebut. Contoh kode yang sudah di modifikasi adalah : 

<a href="http://www.smpn1boyolangu.sch.id " target="new">sekolahku</a> 

atau bisa juga seperti ini : 

<a href="http://www.smpn1boyolangu.sch.id" target="_blank">sekolahku</a> 

• Lanjutkan mengedit link berikutnya dengan cara yang sama.
• Selesai klik Publish & lihat perubahannya saat anda klik link tersebut.

Membuat Link

Link adalah adanya hubungan antara suatu teks atau ikon tertentu dengan suatu halaman web yang dituju. Teks/ikon yang telah memiliki link sering kali ditunjukkan dengan adanya perubahan bentuk pionter panah menjadi jari telunjuk. Untuk teks yang yang telah memiliki link dapat terlihat juga dengan warna yang berbeda dan bergaris bawah. Jika teks/ ikon tersebut memiliki link, maka jika di klik akan mengarahkan kita ke halaman web terkait yang dituju.

1.     Membuat Link pada posting-an 
 

• Buatlah entri/postingan baru

b.     Blok/highlight kata pada postingan yang ingin di buat link, lalu ikon hyperlink yang bergambar seperti inipada toolbar, maka setelah itu akan muncul tampilan edit link

 

c.     Isi kotak isian http:// dengan alamat web tujuan. Lalu klik OK.

d.     Lanjutkan juga membuat link untuk yang lain jika masih ada.

e.     Selesai, Publish postingan.

TUGAS!

Ketentuan:

·       1. Membuat entri baru: beri judul dan buat karangan sebanyak 2 paragraf

·       2. Pada Paragraf 1 terdapat kata sekolahku, dan apabila di Klik akan dibuka halaman web SMPN 1 Boyolangu.

3. Pada Paragraf 2 terdapat kata kotaku, dan apabila di Klik akan dibuka halaman web Pemkab Tulungagung.

2.     Link dengan window baru
Agar pengunjung blog tidak meninggalkan blog kita karena muncul tampilan baru sesaat setelah mengklik link yang kita sediakan. Maka, bisa disiasati dengan cara membuat window baru, ketika pengunjung mengklik salah satu link tersebut. Hasilnya halaman blog tetap ada dan halaman yang baru di klik akan muncul terpisah pada jendela atau tab yang baru. Untuk membuat link seperti ini dapat di lakukan dengan cara : 

Edit entri yang baru saja anda buat di atas.

b.     Pada toolbar pilih   .

c.     Pada tulisan yang kita buat link tadi akan muncul kode seperti ini ( contoh tulisan sekolahku di link ke http://www.smpn1boyolangu.sch.id

<a href="http://www. smpn1boyolangu.sch.id ">sekolahku</a>

maka disini anda harus menambahkan embel-embel kode HTML target="new' ataupun target="_blank" pada awal ataupun akhir kode tersebut . Contoh kode yang sudah di modifikasi adalah :

<a href="http:// www. smpn1boyolangu.sch.id " target="new">sekolahku</a>

atau bisa juga seperti ini :

<a href="http:// www. smpn1boyolangu.sch.id" target="_blank">sekolahku</a>

d.     Lanjutkan mengedit link berikutnya dengan cara yang sama.

Selesai klik Publish & lihat perubahannya saat anda klik link tersebut.