تبلیغات
مقالات آموزشی برنامه نویسی و شبکه - مطالب ابر آموزش جی کوئری به زبان ساده

آموزش جی کوئری به زبان ساده_درس ششم

آموزش جی کوئری درس 6 : جمع و باز کردن یک عنصر (تگ) با جی کوئری:

* برای این کار از توابع slideUp و slideDown استفاده میشه

** نکته خیلی مهم : دقت کنید که جی کوئری به حروف بزرگ و کوچک حساسه ، پس توابع رو دقیقا بصورتی که بنده می نویسم باید بنویسید (به بزرگی و کوچکی حروف استفاده شده در اسامی توابع دقت کنید)



این دستور تگ مورد نظر رو جمع می کنه (ارتفاعش هی کم و کمتر میشه) تا جایی که کاملا تگ غیب بشه. (ارتفاعش 0 میشه)



این دستور تگی که غیب هست (باید یک استایل display:none بهش بدین که در حالت عادی که صفحه لود میشه غیب باشه) رو کم کم باز می کنه (ارتفاعش از 0 هی زیاد میشه) تا جایی که تگ کامل باز میشه (ارتفاعش به ارتفاع خود تگ برسه، یعنی چیزی که توی استایل تگ ست کردین)

عددی که در ورودی  به این توابع میدم (مقدار 2000) زمان به میلی ثانیه است ، بدین معنی که کل عملیات باز شدن باید 2000 میلی ثانیه طول بکشه، یعنی در اینجا کلا 2 ثانیه طول می کشه که کل تگم باز بشه.
به جای دادن عدد می تونین از عبارت هایی مثل fast و slow و normal هم استفاده کنین.

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

نت نیک : آموزش انواع تکنولوژی ها به زبانی کاملا ساده

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


آموزش جی کوئری به زبان ساده_درس چهارم

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

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

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

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


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



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

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

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


آموزش جی کوئری به زبان ساده_درس سوم

آموزش جی کوئری درس 3 : ارور ! تگ مورد نظر پیدا نشد!

همانطور که می دانید ، صفحات وب از بالا به پایین لود می شوند و از اونجایی که ما همیشه طبق استاندارد w3 (سازمان استاندارد سازی وب) کد های جاوا اسکریپت (دستورات جی کوئری از جاو ااسکریپت مشتق می شوند) رو داخل تگ head می نویسیم ، کدهای جاوا اسکریپت ما قبل از لود شدن تگ های html صفحه اجرا میشن.

بنابراین اگر شما کدی نوشته باشین که یه بلایی سر یه تگ html بیاره ، با اروری مواجه خواهید شد که معنیش اینه که تگ مورد نظر رو پیدا نکرده!

خوب بنده خدا راست هم میگه ، چون رمانی که کد جی کوئری شما داره اجرا میشه ، تگ html ای در کار نیست که بخواد یه بلایی سرش بیاره!
سایت نت نیک
در جاوا اسکریپت هم همین مشکل رو داریم که در اونجا این کارو می کردیم:


در جی کوئری ما این کارو می کنیم :


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


آموزش جی کوئری به زبان ساده_درس اول

آموزش جی کوئری به زبان ساده-درس اول: جی کوئری چیست؟
جی کوئری یکی از کتابخانه های نوشته شده به زبان جاوا اسکریپت می باشد ، بدین معنی که یک سری توابع جاوا اسکریپت آماده است که یک سری از برادران زحمتکش عرصه آی تی زحمت کشیدن و برامون نوشتن که ما نیاز نباشه برای هر کار کوچیکی ، یه عالمه کد بنویسیم!
کافیه که فقط توابع و طرز کار با این توابع رو یاد بگیرید تا خیلی راحت و آسوده بتونین کلی افکت های جذاب ایجاد کنین

بدیهی است که تسلط خوب بر جاوا اسکریپت ، خیلی می تونه اینجا کمکتون کنه.

مخصوصا که وسط کد نویسی های جی کوئریمون از جاوا اسکریپت هم به کررات استفاده خواهیم کرد ...
نکته: از اونجایی که جی کوئری در اصل با جاوا اسکریپت نوشته شده ، بدیهی است که وسط کد های جی کوئری میشه کد های جاوا اسکریپت نوشت.

سایت نت نیک|آموزش جی کوئری
کدهای چی کوئری رو کجا بنویسیم ؟ (مواد لازم جهت نوشتن کد جی کوئری!)

برای اینکه بتونین جی کوئری کار کنین ، تقریبا به هیچی نیاز ندارین!

فقط یه نوت پد + داشتن کتابخونه جی کوئری کافیه.

* نوت پد که روی همه ویندوزا هست ولی برای راحتی کار بهتره که یک نرم افزار مخصوص طراحی وب داشته باشین که بنده Microsoft Exression Web نسخه 4 و یا نسخه های بالاترش رو پیشنهاد می کنم.

* فایل کتابخونه جی کوئری رو می تونین از لینک زیر دانلود کنین:
دانلود کتابخانه جی کوئری
البته آخرین نسخه این کتابخونه رو می تونین همیشه از سایت jQuery.Com دانلود کنین.

پس از اینکه فایلا کتابخونه رو دانلود کردین ، (یه فایل با پسوند js است که مشخص می کنه که خود جی کوئری بوسیله جاوا اسکریپت نوشته شده) باید اونو به سند html تون وصل کنین:


همانطور که می بینین من اول فایل جی کوئری رو به صفحه html ام وصل کردم و بعد کد های جی کوئریمو می نویسم.
پس حواستون باشه که ترتیب خیلی مهمه ....

دقت کنین که از اونجایی که کد های جی کوئری هم مشتق شده از جاوا اسکریپته ، می تونین وسط کدهای جی کوئری از کد های جاوا اسکریپت هم استفاده کنین و همچنین عین جاوا اسکریپت می تونین کدهای جی کوئریتونو هم داخل تگ script بنویسین و هم اینکه اونو توی یک فایل جدا بنویسین و با پسوند .js ذخیره اش کنین و بعد تگ script دومی که در کد بالا نوشتم رو عین تگ script اوب می نویسین و در بخش src مسیر فایلی که کدهای جی کوئریتون توشه رو میدین.


در آموزش بعدی شما را با سلکتورهای جی کوئری آشنا خواهیم ساخت و پس از آن در دروس آتی شعبده بازی با جی کوئری را فرا خواهیم گرفت.

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