Bagaimana untuk Menjadikan Div Tidak Kelihatan kepada Acara Tetikus?-tutorial css-php.cn

Bagaimana untuk Menjadikan Div Tidak Kelihatan kepada Acara Tetikus?

Susan Sarandon

Lepaskan： 2024-10-31 11:23:02

asal

281 orang telah melayarinya

How to Make a Div Invisible to Mouse Events?

Mengawal Keterlihatan Klik Div

Masalah:

Untuk mencapai kesan visual tertentu, anda perlu menindih telus

atas teks, tetapi tindanan ini menghalang teks daripada bertindak balas kepada klik untuk tindakan seperti pemilihan pautan atau penyerlahan teks. Bagaimanakah anda boleh menjadikan tindanan "tidak kelihatan" kepada acara tetikus?

Penyelesaian Menggunakan CSS pointer-events:

CSS menawarkan penyelesaian dengan sifat pointer-events. Sifat ini membolehkan anda mentakrifkan gelagat sesuatu elemen berkenaan dengan peristiwa tetikus.

Untuk membuat

tidak kelihatan kepada klik, tetapkan sifat acara penunjuk kepada tiada. Tetapan ini memberitahu penyemak imbas supaya mengabaikan semua peristiwa tetikus yang menyasarkan elemen.

<code class="css">#overlay {
  pointer-events: none;
}</code>

Salin selepas log masuk

Nota:

Harta acara penunjuk disokong dalam penyemak imbas moden seperti Firefox 3.6 , Chrome 2 , IE 11 dan Safari 4 . Untuk keserasian merentas pelayar, anda mungkin perlu meneroka kaedah alternatif atau polyfill.

Atas ialah kandungan terperinci Bagaimana untuk Menjadikan Div Tidak Kelihatan kepada Acara Tetikus?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber：php.cn

Artikel sebelumnya：Bagaimana untuk Menghidupkan Box-Shadow dengan jQuery: Animasi Langsung atau CSS? Artikel seterusnya：Bagaimana Mengira Elemen dengan Kelas yang Sama Menggunakan jQuery?

Kenyataan Laman Web ini

Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Artikel terbaru oleh pengarang

Isu terkini

function_exists() tidak boleh menentukan fungsi tersuai Ujian fungsi () {return true;} jika (function_exists ('test')) {echo "test is functio...

daripada 2024-04-29 11:01:01

2240

Bagaimana untuk memaparkan versi mudah alih Google Chrome Hello cikgu, bagaimana saya boleh menukar Google Chrome kepada versi mudah alih?

daripada 2024-04-23 00:22:19

2380

Tetingkap anak mengendalikan tetingkap induk, tetapi output tidak bertindak balas. Dua ayat pertama boleh dilaksanakan, tetapi ayat terakhir tidak boleh dilaksanakan.

daripada 2024-04-19 15:37:47

1990

Tiada output dalam tetingkap induk document.onclick = function(){ window.opener.document.write('Saya adalah output tetingkap ...