jQuery UI dan ThemeRoller

• Mungkin 6, 2024

Jika anda menginginkan cara yang mudah dan cepat untuk mereka bentuk antara muka pengguna untuk laman web atau aplikasi web dan juga termasuk jQuery, semak jQuery UI. Di sana anda akan mencari pakej comel CSS dan pakej kombo jQuery yang menjadikan menambah ciri-ciri ini untuk projek baru anda.

Mari kita berjalan-jalan di laman web ini. Di bawah pautan Demos dan Dokumen, anda akan dapati senarai plugin interaktif jQuery seperti drag dan drop, tab dan peralihan. Untuk setiap plugin terdapat demo, dokumentasi dan sampel potong-dan-paste kod untuk ujian.

Jika anda ingin merebut fail-fail turnkey, klik pada pautan Tema untuk jQuery ThemeRoller. Css lalai adalah tema tulang putih dan kelabu yang terdedah. Anda boleh mengklik butang muat turun dan gunakan seperti tetapi terdapat juga Galeri tema yang berwarna-warni untuk membuat anda bermula. Di kawasan Galeri terdapat beberapa thumbnail tema. Cuma klik pada yang anda suka. Anda boleh memuat turun tema itu dengan mengklik tab Roll Your Own dan kemudian butang Muat turun Tema. Tapi keseronokan bermula apabila anda mula tweet tema dengan enjin ThemeRoller. Terdapat 11 pilihan yang boleh anda sediakan. Kebanyakan pilihan akan membolehkan anda mengubah tekstur latar belakang dan warna, warna sempadan dan warna teks dan ikon.

Anda mempunyai beberapa pilihan untuk menyiarkan tema.

• Tetapan Font: Anda boleh menukar keluarga font, berat dan saiz.
  
  
• Corner Radius: Anda boleh menukar radius sudut. Setiap tema mempunyai gaya tab bulat lalai tetapi di sini anda boleh menukar saiz sudut atau tetapkannya kepada sifar untuk tab persegi. (Tab dibina pada CSS3, yang tidak disokong oleh IE pada masa ini.)
  
  
• Header / Toolbar: Anda boleh menetapkan nilai warna untuk area di belakang tab dan bidang header seperti untuk plugin kalender.
  
  
• Kandungan: Di sini anda boleh menetapkan warna untuk kawasan kandungan utama. Anda boleh mendapatkan reka bentuk yang sangat berbeza bergantung pada pilihan sempadan anda atau tiada sempadan.
  
  
• Negeri Lalai yang boleh diklik: Ini mengawal penampilan lalai (tidak aktif) pada tab dan butang.
  
  
• Hover State boleh diklik: Kawalan ini adalah untuk penampilan tab dan butang dalam keadaan hover.
  
  
• Negeri Aktif yang dapat diklik: Mengawal penampilan tab dan butang untuk halaman aktif.
  
  
• Sorotan: Warna latar belakang, sempadan, teks dan ikon untuk kawasan yang diserlahkan.
  
  
• Ralat: Warna latar belakang, sempadan, teks dan ikon untuk mesej ralat.
  
  
• Skrin Modal untuk Overlay: Kawal warna latar belakang dan tekstur.
  
  
• Drop Shadows: Kawalan untuk kelegapan bayang-bayang, tebal, mengimbangi dan sudut untuk kesan drop shadow.
  
  

Apabila anda memuat turun jquery-ui-x.x.xx.custom.zip dan upzip pakej, anda akan melihat tiga folder (css, bundle pembangunan, dan js) dan fail index.html. Fail index.html adalah demo untuk plugin yang digayakan dengan tema anda. Anda akan ingin meletakkan folder css dan js di direktori utama anda dan salin / tampal kod dari file index.html ke dalam kod untuk tapak anda di lokasi yang anda mahu plugin dipaparkan.

//jqueryui.com
//jqueryui.com/demos/
//jqueryui.com/themeroller/

Arahan Video: Widget Modifications in JQuery UI using Getter and Setter Methods (Mungkin 2024).