آموزش جی کوئری درس 4: غیب کردن عناصر با جی کوئری

توی جی کوئری خیلی تغییرات توی تگ های صفحه میشه داد که برای هر کدوم جی کوئری یه تابع در اختیارتون میزاره که کار شما فقط فراخونی تابع است و تمام! >> بقیه کارا اتوماتیک توسط جی کوئری عزیز انجام میشه ...

تاز ه از اینجا به بعدشه که شعبده بازی رو یادتون میدم

* غیب کردن یک تگ با استفاده از تابع hide و آشکار کردنش با تابع show انجام میشه


فرض کنین که من یک تگ div رو می خوام غیب کنم.
در این حالت باید کدی بنویسم که وقتی صفحه کامل لود شد ، تگ مورد نظر رو بگیره (با سلکتور) و بعد غیبش کنه (با یکی از توابع جی کوئری)



خوب به همین راحتی توی 3 خط من این کارو انجام دادم!

سایت آموزشی نت نیک

حالا فرض کنین که چند تا تگ div توی صفحه باشه ، در اون صورت اگر من بخوام فقط یکی از این تگ ها رو مخفی کنم ، سلکتور بالا به دردم نمی خوره.

حال اگر تگ های من آی دی داشته باشن و آی دی هاشون با هم فرق کنن.


بدین صورت من اون تگی که آی دی اش  NetNic است رو مخفی کردم.

اکثر توابع جی کوئری می تونن با ورودی و بدون ورودی استفاده بشن که در صورتی که بدون ورودی ازشون استفاده کنین ، تنظیمات پیش فرض جی کوئری برای تابع در نظر گرفت همیشه
تابع hide هم جرء این تابع هاست.

شما می تونین سرعت غیب شدن تگ مورد نظرتون رو تنظیم کنین :
این تابع مقادیر slow رو هم می گیره.
حتی می تونین میزان تاخیر رو به ثانیه بهش بدین :
در اینصورت 2000 میلی ثانیه طول می کشه که تگ بطور کامل غیب بشه.

نکته: در اصل تگ از کنار و پایین بصورت همزمان جمع میشه و جمع میشه تا اینکه عرض و ارتفاعش 0 میشه. حتما عملی کدهایی که درس میدم رو امتحان کنین و دقیقا افکت ها رو ببینین.

* تغییر وضعیت با تابع toggle :

اگر این تابع رو روی یک عنصر اجرا کنین ، خود جی کوئری اول تشخیص میده که تگ مورد نظر در حالت نمایش است یا مخفی .

اگر مخفی باشه تابع همانند دستور show عمل می کنه و اگر آشکار باشه همانند دستور hide عمل می کنه ....


نوشته شده در تاریخ جمعه 14 تیر 1392    | توسط: ح.م    | طبقه بندی: آموزش jQuery،     | نظرات()