Buat Butang Togol dalam HTML CSS & JavaScript

Artikel ini pada asalnya diterbitkan di
https://notarena.com/

Kod ini mencipta butang togol Animasi yang bertukar antara mod terang dan gelap dengan menambah atau mengalih keluar kelas 'gelap' pada elemen badan. Butang togol mempunyai bulatan yang beralih dengan lancar untuk menunjukkan mod, dan latar belakang badan juga beralih dengan lancar untuk pengalaman yang lancar.

Saya menggunakan kesan morfisme, butang dan latar belakang mempunyai peralihan yang cantik yang menambahkan sentuhan keanggunan pada suis togol. Butang togol jenis ini boleh digunakan dalam pelbagai tapak web atau aplikasi, terutamanya yang mungkin memerlukan mod terang dan gelap untuk kebolehaksesan yang lebih baik atau hanya pilihan reka bentuk yang berbeza untuk pengguna.

Anda Mungkin Suka Ini

• Animasi Butang Kongsi
• Butang Radio Tersuai

Untuk membuat butang togol menggunakan HTML, CSS dan JavaScript, anda perlu membuat dua fail: satu fail HTML dan satu fail CSS. Selepas anda membuat fail ini, anda boleh menyalin dan menampal kod yang disediakan ke dalamnya. Anda juga boleh menyalin semua kod sumber.

Buat Butang Togol dalam HTML CSS & JavaScript
Cipta Folder: Mulakan dengan mencipta folder untuk projek anda. Anda boleh menamakannya apa sahaja yang anda suka. Di dalam folder ini, anda perlu mencipta fail berikut:

index.html (untuk struktur Buat Butang Togol anda)
style.css (untuk menggayakan Butang Togol Cipta)
Cipta Fail HTML:

Namakan fail HTML anda index.html.
Cipta Fail CSS:

Namakan fail CSS anda style.css.
Cipta Fail JavaScript:

Namakan skrip fail JavaScript anda.js.

Atas ialah kandungan terperinci Buat Butang Togol dalam HTML CSS & JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!