دوره مجازی جاوااسکریپت (جلسه 28): پروژه - طراحی و پیاده سازی پلاگین Tooltip

- visibility ۱۴ mode_comment

در جلسه امروز به طراحی و پیاده سازی دومین پروژه جامع دوره جاوااسکریپت و جی کوئری خواهیم پرداخت. پروژه این جلسه طراحی یک پلاگین برای ایجاد قابلیت tooltip در صفحات وب هست. با استفاده از این پلاگین شما می تونید نحوه نمایش title تگ ها در صفحات html رو تغیر داده و خیلی زیباتر و شکیل تر کنید. تصویر زیر دقیقا نشون میده این پروژه چیکار میکنه :

tooltipPic

نمایش عنوان به صورت تولتیپ در مقابل نمایش پیشفرض مرورگر

مطالب مطرح شده در این جلسه عبارتند از :

  • پروژه تولتیپ (tooltip) - نمایش عنوان تگ ها به شکلی زیبا
  • تشریح پروژه این جلسه و نحوه کار آن
  • تشریح ساختار و کدهای html و css پروژه این جلسه
  • نحوه استفاده از پروژه این جلسه
  • آموزش نحوه تعین عرض تولتیپ ها در حالت کلی
  • آموزش نحوه اعمال تنظیمات خاص مربوط به هر تولتیپ (تعین عرض، پس زمینه و ...)
  • خواندن عرض تولتیپ از خصوصیت data-ttw تگ
  • نحوه چک کردن وجود یک خصوصیت در یک تگ html
  • نحوه استفاده از متد و رویداد hover برای انجام عملیت در هنگام ورود و خروج موس روی یک تگ
  • نحوه حذف و ذخیره سازی موقت ویژگی title از تگ فعال هنگام نمایش تولتیپ
  • نحوه محاسبه فاصله از بالا و چپ تولتیپ و قراردادن عنوان در مکان مناسب
  • مرور نکته های مهم ارائه شده در این جلسه
info توجه

این مطلب یک جلسه از دوره جاوااسکریپت و جی کوئری می باشد و برای مشاهده آن باید در دوره ثبت نام کنید.

ثبت نام در دوره جاوااسکریپت و جی کوئری

comment دیدگاه کاربران
amir yazdi

سلام
چرا از
به جای
استفاده نکردین؟

لقمان آوند

توی تابع پلاگین خود کیورد this به شی جی کوئری مچ شده اشاره میکنه و می شه به این طریق هم استفاده کرد.

amir yazdi

و چرا از

به جای

استفاده نکردین؟

لقمان آوند

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

Farid S

نمیدونم چرا واسه من درست کار نمیکنه! روی هر کدوم از تگ های لینک مربوطه میرم فقط یک title رو نمایش میده
ببنید (به محتوای درون باکس ایجادی دقت کنید!)
https://jsfiddle.net/w693e9xq/

لقمان آوند

کد پلاگین رو که در ویدیو نوشتیم تست کردید ؟ اون کار می کنه ؟

Sahar Dida

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

وحید صالحی

پلاگین ارتباطی بطول صفحه نداره و کار می کنه حتما شما جایی در کدنوییسی اشتباه کردید!

Sahar Dida

آقای آوند نمیخاین جواب منو بدین؟

وحید صالحی

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

MRZ65

همواره در کنار استاد آوند و سایر اساتید محترم سون لرن هستیم و خواهیم ماند و به شخصه به هر نحوی باشه چه مالی و چه غیرمالی(گزارش متخلفانی که حقوق نشر و صاحبان اثر را رعایت نمی کنند) از شما حمایت میکنیم.تهدیداتی که استاد آوند ذکر کردند هم کاملاً قابل درک هست چون خودم شاهدم آموزشکده های فناوری اطلاعات چه هزینه های هنگفتی در قبال مختصر آموزشی که میدهند(مثلاً برای دوره PHP مبلغ 1میلیون و هفتصد هزار تومان و نه با این کیفیت و بار علمی دوره PHP سون لرن)می گیرند و قطعاً این تهدیدات از سمت این مراکزه .من به نوبۀ خود از اساتید محترم و صدالبته مجرب سون لرن کمال تشکر و قدردانی رو دارم و آرزوی موفقیت در تمام مراحل زندگی شما عزیزان را از خداوند متعال مسئلت می نمایم!…موفق و موید باشید

لقمان آوند

ممنون از شما
خیلی لطف دارید
براتون آرزوی موفقیت می کنم

سوالی که دارم اینه که من کلا نحوه نوشتن این کد رو فهمیدم اما وقتی رفتم یکم سرچ کردم دیدم کلی پلاگین داره که به راحتی میشه ازشون استفاده کرد ، متوجه شدم که بعضی از کد ها رو نمی فهمم و بعضی رو می فهمم، اما میشه به راحتی دست برد توشون
آیا استفاده از پلاگین ها خوبه؟
آیا لازمه این همه کد بنویسیم؟
آیا همه برنامه نویس ها از بیس میشینن و کد می نویسن؟

لقمان آوند

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

نیاز به لاگین

برای ارسال دیدگاه و یا پرسیدن سوال خود در این قسمت، باید در سایت لاگین شوید.