Buat pengalaman gaya aplikasi di tapak web anda
Dinamik HTML (DHTML) membolehkan anda membuat pengalaman gaya aplikasinya di laman web anda, mengurangkan kekerapan bahawa keseluruhan halaman harus dimuatkan sepenuhnya. Dalam aplikasi, apabila anda mengklik pada sesuatu, permohonan itu segera berubah untuk menunjukkan kandungan tertentu atau memberi anda jawapan anda.
Sebaliknya, halaman web biasanya perlu dimuat semula, atau seluruh halaman baru harus dimuatkan. Ini boleh menjadikan pengalaman pengguna lebih teratur. Pelanggan anda perlu menunggu halaman pertama dimuatkan dan kemudian tunggu lagi untuk memuat halaman kedua, dan sebagainya.
Menggunakan & lt; div & gt; untuk Meningkatkan Pengalaman Penonton
Menggunakan DHTML, salah satu cara yang paling mudah untuk meningkatkan pengalaman ini adalah untuk mempunyai elemen div beralih dan dimatikan untuk memaparkan kandungan apabila diminta. Satu elemen div mentakrifkan bahagian logik pada halaman web anda. Fikirkan div sebagai kotak yang mungkin mengandungi perenggan, tajuk, pautan, imej, dan bahkan div lain.
Apa Yang Anda Perlu
Untuk membuat div yang boleh ditanggalkan dan dimatikan, anda memerlukan yang berikut:
- Pautan untuk mengawal div dengan menghidupkan dan mematikannya apabila diklik
- Div untuk menunjukkan dan bersembunyi
- CSS untuk gaya div tersembunyi atau kelihatan
- JavaScript untuk melaksanakan tindakan tersebut
Pautan Mengawal
Pautan mengawal adalah bahagian yang paling mudah. Cukup buat pautan seperti yang anda mahu ke laman lain. Buat masa ini, tinggalkan atribut href kosong.
Belajar HTMLLetakkan ini di mana sahaja di halaman web anda.
The Div to Show and Hide
Buat elemen div yang anda mahu tunjukkan dan sembunyikan. Pastikan div anda mempunyai id yang unik di atasnya. Dalam contoh, id yang unik adalah mempelajari HTML .
Ini adalah lajur kandungan. Ia dimulakan kosong kecuali untuk teks penjelasan ini. Pilih perkara yang ingin anda pelajari dalam lajur navigasi di sebelah kiri. Teks akan muncul di bawah: p> Buat dua kelas untuk CSS anda: satu untuk menyembunyikan div dan yang lain untuk menunjukkannya. Anda mempunyai dua pilihan untuk ini: paparan dan penglihatan. Paparan memindahkan div dari aliran halaman, dan penglihatan hanya mengubah bagaimana ia dilihat. Sesetengah coder lebih suka paparan , tetapi kadang-kadang keterlihatan masuk akal juga. Sebagai contoh: Jika anda ingin menggunakan keterlihatan, kemudian ubah kelas ini kepada: Tambah kelas tersembunyi ke div anda supaya ia bermula seperti yang tersembunyi pada halaman: Semua skrip ini tidak melihat kelas semasa yang ditetapkan di div anda dan bertukar kepada unhidden jika ditandai sebagai tersembunyi atau sebaliknya. Ini hanya beberapa baris JavaScript. Letakkan yang berikut di kepala dokumen HTML anda (sebelum tag Ketahui HTML h3>
CSS untuk Menunjukkan dan Sembunyikan Div
JavaScript untuk menjadikannya berfungsi