آموزش تنظیم کلاس های CSS-مدیریت ظاهر عناصر

با jQuery می توان به راحتی ظاهر عناصر را با دستکاری CSS آن ها تغییر داد.

دستکاری CSS

برای این منظور jQuery چندین متد در اختیار طراح سایت قرار می دهد. در این فصل توابع زیر را شرح خواهیم داد:

• ()addClass :اضافه کردن یک یا چند کلاس به المان های انتخاب شده
• ()removeClass : حذف کردن یک یا چند کلاس از عناصر انتخابی
• ()toggleClass : تغییر وضعیت بین متدهای ()addClass و ()removeClass
• ()css : یک خصیصه را تنظیم کرده یا مقدار آن را برمی گرداند (متد css می تواند چندین خصیصه css یک عنصر HTML را برگردانده و یا به مقدار دلخواه تنظیم کند).

صفحه ی سبک دهی (stylesheet) نمونه ی زیر برای تمامی مثال های این درس بکار می رود:

                        .important {
                        font-weight: bold;
                        font-size: xx-large;
                        }
                        .blue {
                        color: blue;
                        }
                    

متد ()addClass

نمونه ی زیر نحوه ی افزودن class attribute ها را به المان های مختلف نمایش می دهد. البته می توان هنگام افزودن کلاس، چندین المان را انتخاب کرد. متد ()addClass، برای اضافه کردن یک یا چند کلاس به عناصر انتخاب شده بکار می رود.

همچنین می توان چندین کلاس داخل متد addclass() مشخص کرد:

متد ()removeClass

مثال زیر نحوه ی حذف کردن class attribute معین از المان های مختلف را نمایش می دهد:

متد ()toggleClass

نمونه ی زیر چگونگی استفاده از متد ()toggleclass را نمایش می دهد. این متد بین افزودن/حذف کلاس از المان های انتخابی تغییر وضعیت می دهد.