آموزش ۱۰ قطعه کد jquery جدید قسمت دوم

0

۱۰ قطعه کد jquery جدید

آموزش ۱۰ قطعه کد jquery جدید قسمت دوم

مقدمه:خب دوستان خوبم این پست قراره که پست قبلی در مورد [ ۱۰ قطعه کد jquery ] رو ادامه بدیم و ۶ تای باقی مونده از ۱۰ قطعه کدی که رو باید بدونید رو بهتون بگیم همون طور که میدونید  jquery به یکی از عضوهای جدایی ناپذیر طراحی وب تبدیل شده که همه طراح ها یا با اون آشنا هستن یا خیلی خوب اونو میشناسن و میدونن که چه نقش مهمی درطراحی یه وب سایت میتونه داشته باشه برای همین من تو این پست میخوام چند قطعه کد jquery رو بهتون معرفی کنم که میتونه برای هر طراح وبی مفید باشه و برای هر کدام یک مثال ساده میزنم که قابل فهمه و نیاز به توضیح اضافی نداره.

۵- اضافه و حذف کردن یک کلاس css با حرکت ماوس

اجرای این کد روی هر تگ دلخواه باعث میشه وقتی نشانگر ماوس روی اون تگ قرار بگیره کلاس css موردنظری که از قبل تعریفش کردین روی این تگ اعمال بشه و وقتی نشانگر ماوس تگ رو ترک میکنه اون کلاس دیگه اعمال نشه مثلا در مثال زیر یک تگ p داریم که با اومدن نشانگر ماوس روی تگ کلاس hover روی اون اعمال میشه که باعث میشه رنگ متن قرمز بشه و اندازه فونت به ۲۰ px برسه و وقتی هم که نشانگر ماوس تگ P رو ترک کنه همه اینها غیر فعال بشن:

۶- تگ های div هم ارتفاع

با این قطعه کد میتونیم دو تگ div هم ارتفاع بسازیم بدون این که نگران محتویات درون اونها باشیم مثلا در مثال زیر یک تگ div داریم با کلاس mydiv و یک تگ div دیگه داریم با کلاس maindiv که ارتفاعش ۴۰۰ هست(height:400px) و میخوایم تگ mydiv هم به این ارتفاع برسه :

۷-بررسی اینکه آیا یک عکس بارگذاری شده یا نه

با این قطعه کد موقعی که عکسی رو در سایت بارگذاری(Load) کردید میتونید مطلع شوید که این کار به درستی انجام شده یا نه به صورت زیر:

۸- جایگزین کردن عکس های خرابی که در سایت بارگذاری شده اند

با این قطعه کد میشه اگر عکس خرابی در سایت بارگذاری شده به طور اتوماتیک با یک عکس سالم جایگزین بشه.

۹- ساخت یک منو آکاردیون :

ایشالله اگه امکانش بود تو یه پست دیگه طرز ساخت منو آکاردیون رو مفصل براتون توضیح میدم

۱۰- محو کردن و ظاهر کردن یک تگ

با این قطعه کد همونطور که در مثال زیر میبینید دو کلیک داریم به نام های fade و slide که با اولی تگ مورد نظر ما (در اینجا تگ div) مخفی میشه و با دومی از حالت مخفی در میاد و ظاهر میشه.

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

نتیجه گیری:کاربران محترم در اینجا به پایان مطلب آموزش ۱۰ قطعه کد jquery  قسمت دوم رسیدیم امیدوارم کاربردی بوده باشه قسمت برنامه نویسی درباره ی jquery همراه با پردیس سلامت باشید.

لینک مطلب

پاسخ دهید