15 Skrip Kalendar JavaScript dan Kalendar Acara Terbaik untuk 2023

Terdapat banyak sebab mengapa anda mungkin mahu menggunakan skrip kalendar di tapak web anda. Yang paling biasa adalah untuk penyenaraian dan penjadualan acara. Kegunaan lain ialah menyediakan pautan untuk menyenaraikan semua catatan blog atau acara berita yang diterbitkan pada hari tertentu. Dalam sesetengah kes, anda mungkin hanya mencari pemilih julat tarikh dan masa.

Dengan mengambil kira semua kes penggunaan ini, saya membuat senarai beberapa skrip kalendar JavaScript yang paling popular di CodeCanyon.

Skrip kalendar JavaScript dan kalendar acara terlaris di CodeCanyon

Dapatkan salah satu skrip ini dan tambahkan kalendar JavaScript pada tapak web atau apl anda. Skrip ini menawarkan banyak ciri pada harga yang rendah. Jika anda membeli salah satu daripada ini, anda juga mendapat kemas kini seumur hidup percuma dan enam bulan sokongan percuma untuk membantu anda bermula.

Kalendar JavaScript dan Skrip Kalendar Acara terbaik

Dalam siaran ini, saya akan berkongsi pilihan saya untuk beberapa skrip kalendar JavaScript dan pemalam terbaik 2023.

1. Kalendar Acara Mini DZS jQuery

Jika anda sedang mencari skrip kalendar JavaScript yang kelihatan hebat pada semua saiz skrin dan mempunyai banyak ciri, maka pemalam Kalendar Acara Mini DZS jQuery ialah pilihan yang tepat untuk anda.

Ia mudah untuk disediakan dan disertakan dengan dokumentasi terperinci untuk membantu anda apabila anda tersekat. Ia juga sangat disesuaikan dan mesra SEO.

Terdapat banyak mod dan kulit yang tersedia untuk anda gunakan mengikut keperluan anda. Sesetengah acara yang anda tandai pada kalendar anda akan menjadi lebih penting daripada yang lain. Anda boleh dengan mudah membezakan antara acara penting dan rutin menggunakan tag important. Pemalam memaparkan acara penting dalam warna merah dan acara biasa dalam warna biru.

Satu lagi pemalam yang dipanggil DZS Tooltip Plugin telah disepadukan dengan skrip ini untuk memberikan pengalaman pengguna yang lebih baik. Petua alat yang anda buat boleh mempunyai HTML di dalamnya, menjadikannya sangat berkuasa dan fleksibel. Anda pada asasnya boleh menambah apa-apa jenis kandungan (walaupun video) pada petua alat.

Kalendar ini tersedia dalam tiga kulit berbeza, bersih, aurora dan hitam. Anda boleh memilih kulit yang paling sesuai dengan tema anda dan anda boleh memilih untuk memaparkan acara sebagai petua alat atau animasi gelongsor yang lancar.

Selain kalendar acara, skrip ini berfungsi dalam dua mod lain. Mod pertamanya ialah pemilih tarikh yang mudah. Mod kedua adalah lebih menarik, kerana ia membolehkan anda memilih tarikh dan kemudian memaparkan sebarang item yang dipautkan untuk tarikh tersebut - seperti catatan blog.

Jangan lupa untuk menyemak halaman demo skrip. Saya percaya anda akan menyukai ciri yang disediakan dalam pemalam ini.

2. Kalendar acara ringkas

Skrip seterusnya dalam senarai kami ialah Kalendar Acara Mudah yang dinilai tinggi. Ia berdasarkan jQuery dan menyokong pelbagai bahasa.

Perkara pertama yang anda akan perhatikan tentang pemalam ini ialah reka bentuknya yang sangat ringkas namun menarik. Semua hari dalam bulan ditunjukkan di bahagian atas dalam fon kecil untuk menjimatkan ruang, dan hari yang dipilih ditunjukkan dalam fon yang lebih besar.

Acara untuk tarikh yang dipilih ditunjukkan di bahagian bawah. Pengguna boleh mengisih acara berdasarkan masa, tajuk atau keutamaan mereka. Semua tarikh dengan acara dilampirkan ditandakan dengan anak panah supaya anda boleh melihat tarikh yang kosong pada masa ini dan merancang jadual anda dengan sewajarnya.

Anda boleh mencipta acara berulang menggunakan skrip ini. Ini bermakna anda boleh menambah acara yang berulang mingguan, bulanan atau tahunan dengan mudah.

Skrip juga memberi anda akses kepada beberapa kaedah dan panggilan balik acara untuk memanjangkan fungsi kalendar anda atau membantu anda menyepadukannya dengan seluruh tapak web anda.

Anda boleh mencuba semua ciri pemalam pada halaman demo, yang turut menyediakan panduan pemasangan pantas.

3. XML garis masa

TimelineXML ialah tambahan yang sesuai untuk blog, majalah, tapak web berita, portfolio dan banyak lagi anda. Skrip ini mengambil coretan kandungan bercap masa dan meletakkannya pada garis masa. Perkara terbaik tentang TimelineXML ialah fleksibilitinya. Berikut ialah senarai perkara yang boleh dilakukan:

• Menyokong tempoh masa dari satu tahun hingga beribu-ribu malah berjuta-juta tahun
• Menyokong tarikh pra-moden: 1000 SM, 50,000 SM
• Menerima kandungan dalam bentuk fail XML atau kod HTML
• Elakkan acara bersebelahan daripada bertindih
• Sangat boleh disesuaikan dalam kedua-dua fungsi dan gaya
• Mempunyai empat reka bentuk unik: Asas, Moden, Gelap dan Bergaya

4. Kalendar acara Tiwa

Kalendar Acara Tiva menyediakan penyelesaian yang unik dan mudah untuk menjejaki acara berbeza dalam jadual anda.

Skrip ini berbeza daripada dua kalendar acara sebelumnya. Anda mungkin perasan bahawa Kalendar Acara Ringkas dan Kalendar Acara jQuery DZS hanya menandakan tarikh acara pada kalendar. Tiada maklumat lain akan diberikan kepada anda terlebih dahulu. Ini bermakna anda perlu mengklik pada tarikh untuk benar-benar melihat acara tersebut.

Reka letak padat dalam pemalam ini juga berfungsi dengan cara yang sama dan hanya memaparkan acara apabila menuding pada tarikh. Walau bagaimanapun, susun atur penuh pemalam juga memaparkan tajuk acara supaya anda tidak perlu mengklik pada setiap tarikh untuk melihat acara hari itu. Walau bagaimanapun, anda masih boleh mengklik pada acara untuk melihat butiran lanjut tentangnya.

Satu lagi ciri menarik skrip ini ialah acara berkod warna. Anda akan dapat menetapkan warna yang berbeza untuk jenis acara yang berbeza, seperti parti atau mesyuarat perniagaan. Ini memudahkan untuk mendapatkan gambaran keseluruhan jadual anda hanya dengan menyemak imbas kalendar tanpa perlu mengklik pada setiap tarikh.

Kedua-dua reka letak penuh dan padat termasuk paparan kalendar dan paparan senarai. Paparan kalendar akan menunjukkan semua hari dalam bulan seperti kalendar biasa. Paparan senarai, sebaliknya, hanya menyenaraikan semua acara untuk bulan itu. Anda boleh melihat semua operasi ini pada halaman demo.

5. Calentim: pemilih julat masa tarikh

Tidak seperti pemalam lain dalam senarai, Pemilih Julat Masa Tarikh Calentim bukanlah pemalam kalendar acara sama sekali, tetapi hanya memfokuskan untuk menjadi pemilih julat masa tarikh yang hebat.

Dengan fokusnya yang sempit, pemalam ini mempunyai banyak tawaran dalam niche khusus ini. Salah satu perkara terbaik tentang skrip ini ialah pemilih kelihatan hebat pada semua saiz skrin.

Ia sesuai untuk peranti mudah alih kerana reka bentuk responsif dan penggunaan gerak isyarat seperti sokongan leret sentuh. Contohnya, mudah untuk bertukar antara bulan dan tahun berkat reka bentuk pemalam yang bertimbang rasa.

Ia juga mudah untuk disesuaikan, jadi anda boleh menyembunyikan sebarang elemen UI dan melumpuhkan ciri yang tidak diingini.

Pemalam menyokong 109 bahasa yang berbeza. Ini pada asasnya bermakna bahawa skrip kemungkinan besar mempunyai sokongan terbina dalam untuk bahasa yang digunakan oleh pelanggan anda.

Banyak ciri lain dalam skrip disebut pada halaman demo pemalam. Cuba sahaja contoh di halaman. Saya pasti anda akan menemui semua ciri yang anda jangkakan dalam pemalam kalendar pemilih julat tarikh.

6. Suite Kalendar Jalendar 2

Jalendar 2 Calendar Kit ialah pemalam berasaskan jQuery yang menyediakan banyak ciri berbeza. Salah satu kelebihan terbesarnya ialah kemudahan penyesuaian. Contohnya, anda boleh menukar warna latar belakang kalendar dan warna hari, minggu atau tahun dengan cepat. Ini bermakna pemalam tidak akan kelihatan ketinggalan di tapak web anda. Anda boleh menukar semua nilai warna dengan mudah supaya ia sepadan dengan skema warna anda.

Jumlah bilangan acara untuk setiap bulan ditunjukkan dalam gelembung pemberitahuan dan tarikh ditandakan dengan titik berwarna kecil. Mengklik pada tarikh memaparkan semua acara untuk tarikh tertentu itu.

Anda boleh menggunakan pemalam ini dalam empat cara berbeza. Anda boleh menggunakannya sebagai kalendar acara, pemilih tarikh atau pemilih julat tarikh, penggunaan keempat pemalam ini adalah sebagai penyambung tarikh, ini membolehkan anda menetapkan tarikh yang berbeza kepada pautan yang berbeza. Ini berguna apabila anda mahu pengguna membuka catatan blog dari tarikh tertentu.

Satu lagi ciri menarik skrip ini ialah ia menyokong 13 bahasa berbeza. Jika pelanggan anda tidak memahami bahasa Inggeris, anda boleh memilih daripada 12 bahasa tambahan semasa membuat kalendar acara anda.

7. Caleran: pemilih julat tarikh

Caleran: Pemilih julat tarikh dilengkapi dengan fungsi pemilihan julat, menjadikannya pemilih julat tarikh yang berkesan untuk anda gunakan sebagai alat tempahan di tapak web anda untuk memudahkan kehidupan pelanggan anda. Ia berfungsi dengan lancar pada semua penyemak imbas moden dan peranti mudah alih. Ia juga menyokong reka letak potret dan landskap. Anda juga boleh menggunakannya sebagai kalendar pemilih tarikh tunggal yang boleh dipaparkan sebaris di tapak web anda atau sebagai menu lungsur di sebelah input.

Caleran dibina menggunakan perpustakaan jQuery dan Moment.js. Ia datang dengan satu tan pilihan penyesuaian, yang boleh anda temui pada halaman Tetapan dan Acara. Skrip menyokong terjemahan dan boleh disetempatkan ke dalam lebih 100 bahasa.

8. Pemilih tarikh skrin penuh: pemalam jQuery

Pemalam pemilih tarikh jQuery yang sangat disesuaikan ini menyediakan cara yang cepat dan mudah untuk mengurus tarikh dalam medan teks input. Ia disertakan dengan kesan CSS3 untuk menjadikan kalendar anda hidup tidak kira bahasa atau penyemak imbas yang anda gunakan. Pemalam ini menyokong sentuhan dan leret, menjadikannya sempurna untuk peranti mudah alih.

9. SmartCalendar: Kalendar pemilih masa tarikh pelbagai guna

SmartCalendar ialah pemalam pemilih input masa jQuery responsif dan pelbagai guna yang boleh disepadukan dengan mudah ke dalam kalendar anda. Warna mudah disediakan dan disesuaikan dengan dokumentasi terperinci. Kalendar penuh mempunyai pilihan sebaris dan lungsur, dan boleh bertukar antara bulan dan tahun dengan mudah. Ia kelihatan hebat pada semua peranti dan penyemak imbas moden, dan anda boleh menterjemahkannya ke dalam berbilang bahasa.

10. AddToCalendar: Tambahkan acara pada kalendar anda

AddToCalendar membolehkan pengguna menambahkan acara atau bengkel anda dengan mudah pada kalendar mereka. Cuma tambah butang "Tambah ke Kalendar" untuk persediaan dan penyepaduan yang mudah ke dalam tapak web atau apl anda. Dibina dengan jQuery, pemalam mudah disesuaikan ini menyokong zon waktu dan berbilang pembekal kalendar, termasuk Kalendar Google, Outlook, Kalendar Yahoo dan iCalendar. Kalendar jQuery ini didokumenkan dengan baik dan disertakan dengan fail beranotasi dengan baik.

Kalendar JavaScript dan Kalendar Acara JavaScript Percuma

Kalendar

Pemalam kalendar dan pemilih tarikh yang elegan untuk Vue.js. Semak di GitHub!

tui.calendar

tui.calendar ialah perpustakaan kalendar berciri penuh yang berkuasa untuk memaparkan acara tersuai, jadual dan tugasan dalam paparan harian, mingguan dan bulanan.

Kalendar Besar Reaksi

Kalendar acara ini dibina dengan React dan menggunakan Flexbox. Ia dioptimumkan untuk pelayar moden. Lihat projek GitHub untuk bermula.

calendar.js

Calendar.js ialah perpustakaan JavaScript kalendar acara berciri penuh yang membolehkan anda melihat dan mengurus acara (seperti tugasan yang dijadualkan dan janji temu) dalam antara muka kalendar responsif.

Lihat dan urus acara dengan kalendar JavaScript yang responsif dan berciri penuh ini. Anda boleh menambah atau memadam acara dan mengedit acara dalam tetingkap pop timbul. Anda juga boleh mengeksport acara ke JSON, teks, XML, CSV, iCal, Markdown atau HTML.

Pautan kalendar

Pustaka JavaScript Pautan Kalendar menjana pautan kalendar secara automatik berdasarkan acara yang anda sediakan supaya anda boleh menambahkan acara pada Kalendar Google, Kalendar Yahoo, Microsoft Outlook, Office 365 dan iCalendar.

Perkara yang perlu dipertimbangkan semasa memilih pemalam kalendar JavaScript

Harga

Pemalam kalendar JavaScript premium terdapat dalam pelbagai julat harga, jadi pilih satu yang mempunyai semua ciri yang anda perlukan dalam lingkungan belanjawan anda.

Mesra mudah alih

Lebih 80% pengguna mengakses tapak web atau apl anda melalui peranti mudah alih, jadi pilih pemalam kalendar yang bertindak balas dengan berkesan kepada mana-mana peranti (desktop, tablet atau telefon pintar).

Keserasian dengan pelayar moden

Pengguna mempunyai penyemak imbas kegemaran mereka sendiri, jadi pilih pemalam yang berfungsi dengan semua penyemak imbas moden.

Dokumentasi

Dokumentasi yang baik adalah penting untuk membantu anda menyediakan kalendar anda dan menyesuaikannya mengikut gaya anda.

Tambahkan skrip kalendar JavaScript ke tapak web anda sekarang!

Skrip kalendar JavaScript yang tersedia di CodeCanyon adalah sempurna sebagai pemalam kalendar acara atau pemilih tarikh dan masa, menawarkan banyak reka letak dan pilihan penyesuaian yang berbeza.

Jika anda ingin mengetahui lebih lanjut, Envato Tuts+ mempunyai banyak tutorial kalendar dan sumber jQuery:

Atas ialah kandungan terperinci 15 Skrip Kalendar JavaScript dan Kalendar Acara Terbaik untuk 2023. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!