Latest web development tutorials

tema jQuery UI

Semua jQuery UI plug-in memungkinkan pengembang untuk berintegrasi mulus widget UI untuk tampilan dan nuansa situs atau aplikasi mereka. Setiap widget didefinisikan oleh gaya CSS, dan berisi dua informasi gaya: standar jQuery UI CSS framework gaya dan plug-in gaya tertentu.

framework jQuery UI CSS memberikan representasi semantik kelas untuk menunjukkan peran dari elemen komponen kecil, seperti judul, isi, atau area yang dapat diklik. Ini konsisten di semua bagian-bagian kecil, dan tab diklik (tab), akordeon (akordeon) atau tombol (Button) memiliki sama ui-state-default , kelas, untuk menunjukkan bahwa mereka dapat diklik a. Ketika pengguna melayang di atas elemen-elemen ini, kelas menjadi ui-state-hover , maka elemen ini menjadi yang terpilih di ui-state-active . Kelas konsistensi membuat penampilan kinerja yang konsisten dari semua elemen atau komponen yang memiliki peran serupa di negara interaksi.

bingkai gaya CSS dirumuskan dalam file terpisah, bernama ui.theme.css . File ini melalui ThemeRoller aplikasi untuk memodifikasi. Bingkai gaya berisi hanya mempengaruhi penampilan dan nuansa properti, asalkan warna, gambar latar belakang, ikon dan sebagainya. Jadi ini adalah "aman" gaya, tidak akan mempengaruhi fungsi plug-in. Pemisahan ini berarti bahwa pengembang dapat menggunakan di theme.css mengubah warna dan file gambar untuk menciptakan tampilan kustom dan merasa. Sejak masa depan plug-in atau perbaikan bug akan tersedia, dan ini dapat digunakan tanpa modifikasi oleh tema.

Sejak penutup bingkai gaya hanya melihat dan merasa, sehingga perlu untuk menyertakan spesifik plug-in style sheet, style sheet ini mencakup semua widget tambahan memungkinkan aturan gaya struktur fungsional, seperti ukuran, padding, margin, positioning, mengambang. Setiap widget stylesheet themes/base folder, dan dengan "jquery.ui.accordion.css" plug-in nama, seperti. Pola-pola ini harus hati-hati diedit script karena mereka memberikan kerangka yang mencakup gaya bersama-sama.

Kami mendorong semua pengembang untuk membuat plug-in jQuery, framework jQuery UI CSS memudahkan pengguna akhir untuk menggunakan tema kustom dan plug-in.

theming

Berikut adalah tiga dari widget jQuery UI yang berkaitan dengan prosedur umum:

  • Ambil ThemeRoller topik: pertama membuat tema adalah dengan menggunakan ThemeRoller untuk menghasilkan dan men-download tema. Aplikasi ini akan membuat yang baru ui.theme.css berkas dan berisi semua gambar latar belakang yang diperlukan dan ikon sprite images folder. Metode ini adalah yang pertama untuk menciptakan dan memelihara tema dari jalan, tapi pilihan itu memberikan terbatas ThemeRoller kustom.
  • Memodifikasi file CSS: Dalam rangka untuk lebih tampilan dan nuansa dari kontrol, Anda dapat memilih dari tema default (Smoothness) dimulai, atau dari satu topik yang dihasilkan oleh ThemeRoller Start, dan kemudian menyesuaikan ui.theme.css berkas, plug-in yang terpisah atau stylesheet. Misalnya, Anda dapat dengan mudah mengatur sudut radius semua tombol berbeda dari nilai-nilai komponen UI lainnya, atau menggunakan ikon kustom untuk mengubah wizard jalan. Gaya rentang melalui sedikit, Anda bahkan dapat menggunakan lebih dari satu tema dalam UI. Untuk perawatan lebih mudah, perubahan yang diusulkan hanya ui.theme.css file dan gambar.
  • Re-menulis CSS kustom: Untuk memaksimalkan kontrol tampilan dan nuansa, Anda dapat mulai menulis lagi pada setiap widget dan CSS, tanpa menggunakan kelas kerangka plug-in atau stylesheet tertentu. Jika Anda ingin terlihat dan merasa dapat dicapai dengan memodifikasi CSS atau menggunakan tag yang sangat disesuaikan, maka Anda dapat menggunakan metode ini. Pendekatan ini memerlukan keahlian yang mendalam dalam hal CSS, dan memerlukan pembaruan manual untuk masa depan plug-in.

Gunakan ThemeRoller, jQuery framework UI CSS, serta tema desain kustom